Optimizing the end-user experience: How to perform a browser check in Grafana Cloud Synthetic Monitoring

• 2025-06-03 • 5 min

Synthetic monitoring is a vital practice to proactively track the health and performance of web applications. Instead of waiting for users to report problems, synthetic monitoring helps developers catch issues before they impact real users.

One powerful type of synthetic monitoring is the browser check. These checks go beyond basic ping checks, simulating how a user would actually interact with your website’s interface. They help ensure critical user flows like login, checkout, or navigation are functioning as expected across different devices and screen sizes.

You might use a browser check when you’re:

Preparing for a big launch and want to ensure the user experience is error-proof.
Validating that your core application workflows are working as expected.
Troubleshooting performance or frontend issues.
Testing your site’s behavior on different device types or screen resolutions, or in different global location

In this blog post, we’ll walk through how browser checks work and show you how to create one using Grafana Cloud Synthetic Monitoring. You can also watch through the setup process visually by checking out the YouTube video below.

What is a browser check?

Grafana Cloud Synthetic Monitoring enables you to proactively monitor the performance of your critical user flows, websites, and APIs from locations around the world. It helps provide an external perspective on availability and performance from globally distributed public and private probes. With this solution, you can set up a variety of checks, including ping checks, DNS checks, and scripted checks.

Browser checks — which are now generally available in Grafana Cloud Synthetic Monitoring — are a type of scripted check that simulate real user behavior in your application’s UI.

With browser checks, developers can:

Simulate user interactions on a web page, such as scrolling, clicking, navigation, and form submissions.
Execute requests both at the protocol level and within the browser to emulate realistic, interactive user scenarios.
Configure window sizes to test across various device views, including mobile, tablet, and desktop.

All checks are powered by the Grafana k6 browser testing APIs, enabling you to interact with your application and gain meaningful performance insights.

Run a browser check

Let’s walk through setting up a browser check for a sample e-commerce website that allows users to browse and purchase various products. This process includes three key steps:

Writing a k6 browser check script
Executing the script in Grafana Cloud
Visualizing the check results

Writing a k6 browser check script

1. Create a Grafana Cloud account

If you don’t already have one, sign up for a free Grafana Cloud account. Browser checks can be executed either locally or through Grafana Cloud. In this post, we will focus on cloud execution.

2. Navigate to Synthetic Monitoring

In the Grafana Cloud UI, go to Testing & synthetics to access tools for performance testing and optimization, including Grafana Cloud k6 and Synthetic Monitoring features.

A screenshot showing where to find the Testing and synthetics option in the Grafana Cloud UI.

3. Select Synthetic Monitoring and create a check

Next, click Synthetic Monitoring and choose Create check. Select Browser as the check type.

A screenshot of the Choose a check type page.

4. Add browser script

Next, provide a Job name. We’ll use the name Store:BrowserCheck. For our Instance, we’ll use the name test.

A screenshot of the Job name and Instance fields.

Executing the script in Grafana Cloud

1. Paste your script into the built-in editor

Grafana Cloud Synthetic Monitoring offers a built-in script editor for quick prototyping. Users are provided with an example script.

In the script editor, we can paste our full browser test script, which simulates a complete user journey: browsing products, adding an item to the cart, and completing a purchase.

2. Set a timeout

With our script now added, we can proceed to execute the browser check. Specify the timeout value for the check. If the script takes longer than this period to run, the check will be marked as failed. For this example, we’ll keep the default value of one minute.

A screenshot showing the Define uptime page.

3. Add labels

Labels help you organize and filter your checks. Adding a label makes it easier to segment results by environment or use case in the future. For this example, we’ll use the label env:test.

4. Choose a probe location

Grafana Cloud offers access to over 20 globally distributed probe locations. For this example, we’ll select Calgary, Canada. Choose the location closest to your users or infrastructure to best reflect their experience.

A screenshot showing options for probe locations.

5. Set your test frequency

Determine how frequently you want your browser check to run. We chose a five-minute interval to continuously monitor performance and availability.

A screenshot of the test frequency settings.

6. Save and run the check

Click Save to initiate the browser check. Grafana Cloud will begin executing it based on your configuration. You can also click the Test button to validate the check before saving.

Visualizing the check results

After letting our browser check run for a week, it’s time to review the results. Grafana Cloud Synthetic Monitoring provides a preconfigured dashboard for each check, giving you instant access to key insights. You’ll find essential metrics like uptime, reachability, and core web vitals, including:

First Contentful Paint (FCP)
Largest Contentful Paint (LCP)
Time to First Byte (TTFB)
Cumulative Layout Shift (CLS)

A screenshot of a dashboard in Grafana Cloud Synthetic Monitoring displaying browser check results.

As you scroll through the dashboard, you’ll uncover even more detailed charts: assertions tested (with pass/fail counts), response times, data transfer sizes, and detailed request logs complete with timestamps. All this information is updated in real time, making it easy to track trends, catch regressions early, and maintain a high-performing user experience.

Wrapping up

Browser checks are an essential component of synthetic monitoring, providing deep visibility into your frontend performance. By leveraging Grafana Cloud Synthetic Monitoring, you can effortlessly implement and manage browser checks to ensure the reliability of your most critical services.

To learn more about Synthetic Monitoring in Grafana Cloud, please refer to our technical docs. You can also explore this dashboard on Grafana Play, which features example checks.

Grafana Cloud is the easiest way to get started with synthetic monitoring. We have a generous free tier that includes 100k test executions per month and more. Sign up for free now!