---
title: "Frontend Observability alerts | Grafana Cloud documentation"
description: "Learn how to set up out of the box alerting in Frontend Observability"
---

> For a curated documentation index, see [llms.txt](/llms.txt). For the complete documentation index, see [llms-full.txt](/llms-full.txt).

# Frontend Observability alerting

Proactively monitor frontend application health and performance with predefined alerts based on Faro data. These alerts automatically detect critical issues like performance degradations, error spikes, and Web Vitals threshold breaches, enabling your team to respond to problems before they significantly impact users.

## How it works

Frontend Observability alerts are built on Grafana-managed alerts directly from Loki.

Frontend Observability includes the following alerts based on predefined rules:

Expand table

| Alert name        | Description                                                                               |
|-------------------|-------------------------------------------------------------------------------------------|
| Errors Count      | Fires when the number of errors increases day over day for the last 24 hours              |
| New Errors        | Fires when there are new errors in the last 24 hours                                      |
| Web Vitals - FID  | Fires when the First Input Delay (FID) is greater than 300ms for the last 6 hours         |
| Web Vitals - LCP  | Fires when the Largest Contentful Paint (LCP) is greater than 4000ms for the last 6 hours |
| Web Vitals - CLS  | Fires when the Cumulative Layout Shift (CLS) is greater than 0.25 for the last 6 hours    |
| Web Vitals - TTFB | Fires when the Time to First Byte (TTFB) is greater than 1800ms for the last 6 hours      |
| Web Vitals - FCP  | Fires when the First Contentful Paint (FCP) is greater than 3000ms for the last 6 hours   |
| Web Vitals - INP  | Fires when the Interaction to Next Paint (INP) is greater than 500ms for the last 6 hours |

## Before you begin

- Ensure you have permission to create and edit an application in Frontend Observability
- Ensure you have permission to [create folders and Alerts](/docs/grafana/latest/alerting/set-up/configure-roles/#configure-roles-and-permissions) in Grafana
- Ensure you have a basic understanding of Grafana-managed alerts

## Enable alerts

You can enable alerts when you create a new application or on existing applications.

### Enable alerts on new applications

1. Use the left navigation to select **Observability > Frontend** and then click **Create New**.
2. Complete the usual steps to create a Frontend Observability application.
3. In the **Enable alerting** section, select the alerts that you want to apply to your application.
4. Click **Complete**.

### Enable alerts on a single existing application

> Tip
> 
> You can click the toggle next to any alert to view the expression it uses and what it is currently recording. This displays data only if the alert is enabled.

1. Use the left navigation to select **Observability > Frontend** and then choose the desired application.
2. Click **Settings > Alerting**.
3. Select the alerts that you want to apply to this frontend application.
4. Click **Enable selected alerts**.

### Enable alerts for all existing applications

You can manage alerts for all applications on the Frontend Observability Configuration page. This includes enabling and disabling alerts.

> Tip
> 
> You can click the toggle next to any alert to view the expression it uses and what it is currently recording. This displays data only if the alert is enabled.

1. Use the left navigation to select **Observability > Frontend > Configuration**.
2. In the **Enable alerts** section, select the alerts that you want to apply to frontend applications in your Grafana instance.
3. Click **Enable alerts**.
4. For each alert that you selected, choose the applications where you want to enable the alerts.
5. Click **Save**.

## Configure threshold values

You can edit basic threshold values for alerts on a per application basis to prompt them to fire based on your specified criteria.

1. Use the left navigation to select **Observability > Frontend** and then choose the desired application.
2. Click **Settings > Alerting**.
3. Select the alerts that you want to edit and click **Edit alert thresholds**.
4. Make the necessary changes and then click **Save Changes**.

> Note
> 
> You can make more advanced edits to alerts by clicking **Edit alert rule in Alerting**. Refer to [Configure alert rules](/docs/grafana-cloud/alerting-and-irm/alerting/alerting-rules/) for more information.

## Configure alert notifications

By default, Frontend Observability doesn’t include contact points for predefined alerts. If you want to configure alert notifications, you must add the appropriate contact points for each alert rule.

### Steps

1. Use the left navigation to select **Observability > Frontend > Configuration**.
2. In the **Enable alerts** section, click **View in Alerting**.
3. Choose the alert rule for which you want to configure a notification and click **Edit**.
4. In the **Configure notifications** section, toggle off **Advanced options**.
5. Refer to [Configure contact points](/docs/grafana-cloud/alerting-and-irm/alerting/configure-notifications/manage-contact-points/) to learn more.

## Next steps

- [Create SLOs](/docs/grafana-cloud/monitor-applications/frontend-observability/settings-and-policies/slo-create/) based on your frontend metrics to track performance targets
- [Integrate with Application Observability](/docs/grafana-cloud/monitor-applications/frontend-observability/integrate/apm-integration/) to correlate frontend alerts with backend traces
- Configure [data privacy settings](/docs/grafana-cloud/monitor-applications/frontend-observability/settings-and-policies/data-privacy/) to ensure compliance