Compare page load performance in browser and synthetic monitoring

Synthetic monitoring regularly checks your websites, critical business transactions, and API endpoints to measure optimal performance. Browser monitoring tracks the actual results of webpage performance across all variations of devices, browsers, and connection speeds. Used together, they provide a direct page load time comparison between real user (browser) interactions and the synthetic monitors.

Compare performance and trends

New Relic's comparative charting feature helps operations managers and teams by providing:

  • Benchmarks for page load times
  • Additional insights to help you plan where to optimize your site
  • Comparisons of synthetic trends vs. actual browser performance without needing to switch between our monitoring capabilities.

For example, during a page outage, you can compare synthetic monitoring trends to actual browser monitoring comparisons to see if an issue is also visible in Synthetics UI, or if it is caused by variables outside of New Relic. This helps you more efficiently know where to take action.

What you need

The comparative charting feature requires:

After you enable the comparative charting feature either from synthetic or from browser monitoring, no additional setup is required. The comparative charting feature will appear when New Relic finds matching URLs.

Enable comparison data

After you enable the comparative charting feature from either synthetic or browser monitoring, no additional setup is required. The comparative charting feature will appear whenever synthetics or browser monitoring finds matching URLs.

Enable comparative charting from Synthetics UI

To enable the comparative charting feature from Synthetics UI:

  1. Go to one.newrelic.com > Synthetics > (select a monitor) > Summary.
  2. Above the selected monitor's Availability chart, select the ellipsis [ellipsis icon] icon.
  3. Select Enable Synthetics comparison.
Enable comparative charting from Browser UI

To enable the comparison data feature from New Relic Browser monitoring:

  1. Go to one.newrelic.com > Browser > (select a browser app) > Page views.
  2. Select a page monitored by synthetic monitoring.
  3. From the selected page's Performance tab, select the ellipsis [ellipsis icon] icon.
  4. Select Enable Synthetics comparison.

View comparison data

The comparative charting feature appears whenever synthetic monitoring identifies a URL match with browser monitoring and can compare it. You can compare browser and synthetic's performance either from the Synthetics UI Summary page or from the Browser UI Page views page (for browser apps or single page apps) without needing to switch between New Relic capabilities.

Based on the selected data sources, the summary shows:

  • Overall speed percentage comparison between browser (real user) page views and any matching URLs found in synthetic monitors that the user has permissions to view
  • Number of URLs found in synthetic monitors that match the Browser rollup URL

To view the comparative charting summary:

  1. From Synthetics UI: Go to one.newrelic.com > Synthetics > (select a monitor) > Summary.

    OR

    From Browser UI: Go to one.newrelic.com > Browser > (select a browser app) > Page views, then select a page monitored by synthetic monitoring.

  2. Review the comparative charting feature's summary of overall speed percentage and number of matching URLs.
  3. To view additional details, select the summary's right arrow [right arrow icon] icon.

Please note that in some cases the simple browser monitor ends before the browser agent has had a chance to collect the BrowserInteraction event. In this case, no comparative charting data is displayed in the UI. In order to resolve this issue, create a scripted browser monitor instead, and add a call to wait (sleep) after the page is loaded. Here is an example:

$browser.get('https://www.mywebsite.com').then(function(){
return $browser.sleep(1000);
})

Hide or return comparison data

To hide the comparative charting feature, select the ellipsis [ellipsis icon] icon.

  • To keep it visible but move it away from the top of the page, select Move to bottom.
  • To return it to its original place on the page, select Move to top.
  • To remove it from the page, select Hide all Synthetics/Browser comparisons.
  • To return it to the page after removing it, follow standard procedures to enable comparison charting.

Data sources

New Relic uses these data sources for the synthetics and browser comparison in the UI. For deeper analysis of the comparative chart data you see in the UI, use the query builder to run NRQL queries.

Variable Description
Monitor account ID

The account from which you are running the monitor:

SELECT monitorAccountId FROM BrowserInteraction
Monitor ID

The unique ID assigned to your synthetic monitor:

SELECT monitorId FROM BrowserInteraction
Monitor job ID

The ID of a single synthetics monitor run, which began at a specific time and originated from a specific location:

SELECT monitorJobId FROM BrowserInteraction LIMIT 1
Real user average The average page load time for real users viewing your website (excludes synthetic monitors).
Real user page views Page view details coming from visitors to your website (exclude synthetic monitors).
Synthetic's average The average page load time from the synthetic simple or scripted monitors that ran on your website.
Synthetic's page views Only traffic generated by synthetic simple or scripted monitors.

For more help

If you need more help, check out these support and learning resources: