Experience Vitals

Latest Dynatrace
Overview
4min
Preview

The Experience Vitals app is an entry point for frontend monitoring of web and mobile applications. It provides a list of monitored frontends, along with several digital experience performance metrics, like core web vitals and app start duration, that indicate the health state of frontends. The provided metrics can be analyzed with different filters, such as browser type, operating system, or country name. The app also contains a setup flow, to set up new monitored frontends and the frontend monitoring settings.

Join the New RUM Experience preview.
Enable New RUM Experience.

See New RUM Experience settings

When you open the app, you're welcomed with an overview of the monitoring and health states of the frontends:

The number of frontends that are enabled on Grail. Only frontends that are enabled on Grail are monitored in the Experience Vitals app. Grail monitoring can be easily enabled in the frontend settings.
Health state of frontends: This breakdown shows the number of frontends by health state: Unhealthy, Warning, Healthy or Disabled.
Links to the setup flow and the Explorer view.

Explorer view

The Explorer view provides an overview of all frontends, along with digital experience performance metrics and health alerts. You can open the quick filters bar on the left to filter the frontends for different properties, such as Health status, RUM and various settings.

The default selection for the analyzed timeframe is Last 2 hours, but you can change it using the timeframe selector on the top right. There's no limit on the selectable timeframe, but there are limitations. The default retention time for user events is 35 days.

When you reach a higher data amount due to a bigger timeframe or ingest lots of data, the data is sampled automatically. You will notice that the queried data is sampled when the information icon next to the cards turns blue. There, you can also find further explanations. To query data with a lower or no sampling rate, you can either reduce the timeframe inside the app or use the Open with Notebooks link, which you will find next to all the data charts/tables.

Frontend summary - Overview tab

When selecting a frontend from the Explorer table, the summary view pops open and presents you a range of overtime metrics and further frontend-related data.

Web-related:

Largest Contentful Paint (LCP)
First Input Delay (FID)
Cumulative Layout Shift (CLS)
Interaction to Next Paint (INP)
Called services - which services the frontend interacted with

Mobile-related:

App start duration : Duration from app opening to when the first view becomes visible
- Filterable by cold and warm app start
App start count: Count of app starts during one minute
- Filterable by cold, warm and hot app start
Crash rate: Crash count per minute

The mobile charts additionally allow to not only filter by certain criteria, but also allow splitting by app version.

All frontend types:

Error rate: Error count per minute grouped by error types, including both request errors and custom errors
- Filterable by error type

For further drill-down analysis, open the Performance analysis view using the Analyze performance button on the top right or on top of one of the cards.

Health state

In the preview version of the Experience Vitals app, the health state is calculated from the core web vitals metrics (for web) as well as cold and warm app start duration (for mobile). For web, the static thresholds are taken from the core web vitals specification. There the 75th percentile of page loads is used across all browsers and device types. For mobile, frontends we use the 75th percentile over all cold and warm app starts.

Health alerts are shown then in the Frontend tables in the Explorer view, and also marked above the charts. These are the thresholds for the different health states:

Metrics

Healthy

Warning

Unhealthy

LCP

up to 2.5 sec

between 2.5 sec and 4.0 sec

more than 4.0 sec

FID

up to 100 ms

between 100 ms and 300 ms

more than 300 ms

CLS

up to 0.1

between 0.1 and 0.25

more than 0.25

INP

up to 200 ms

between 200 ms and 500 ms

more than 500 ms

App start cold duration

up to 5.0 sec

over 5.0 sec

App start warm duration

up to 2.0 sec

over 2.0 sec

Frontend summary - Settings tab

When selecting a frontend from the overview table, the Settings tab contains the frontend settings.

For example, you can turn on the New RUM Experience in the Enablement and cost control section.

You can review all settings available here (link to new rum experience settings page).

Mobile frontend summary - Instrumentation tab

For all mobile frontends, you can navigate to a specific instrumentation tab and get guided through the instrumentation process for different platforms.

Set up a new frontend

Use + Frontend to set up additional monitored frontends. Then you switch to a guided setup screen, which tells you step-by-step, how to monitor your frontend and which decisions and actions you should take.

Performance analysis

The Performance view shows charts you already know from the frontend summary with additional drill-down options. The filter bar supports filtering of the performance metrics by Country code, Browser name, Device type, Operating system and User type. Moreover, the Performance analysis view contains a list of frontend errors with a link to the Error Inspector app for further analysis.