If you don't have one already, create a New Relic account. It's free, forever.
Enable browser monitoring
Browser Pro+SPA is the default agent when you enable browser monitoring. This automatically gives you access to all of our browser monitoring features. For more information about the browser monitoring options, see Browser agent types in this document.
To enable browser monitoring:
- Go to one.newrelic.com, click Add data, then click Browser and mobile.
- Follow the instructions in the UI to select which data source for browser monitoring you want to use for your app, such as New Relic Browser.
- Generate some traffic for your app, then wait a few minutes for data to appear in New Relic.
- Optional: After installation is complete and you are seeing data, go to the App settings page for additional agent configuration, or to change the browser agent type.
It may take several minutes after enabling the browser monitoring agent before your webpage data appear in New Relic. If have problems, follow our troubleshooting tips.
To learn more about the scripts used to install the agent, check out the browser agent's Read me file in our GitHub repo. You can also learn about the third party libraries called during installation in the Third party notices file.
Enable automatically on APM-monitored app
APM-monitored apps are listed on your APM Applications index.
Enable with copy/paste
- Standalone apps, static sites, and cached pages delivered by CDN
- apps that are not as closely coupled to the browser app as with a standard server-side app (for example, when your client-side app talks to a REST API back end)
To learn how to use the copy/paste method, watch this short YouTube video (approx. 1:50 minutes).
- Placement in your webpage: Copy the code snippet, then paste it inline into your pages as close to the top of the
<head>element as possible, but after any position-sensitive
<meta>tags (for example,
charsetinformation). For more information on the inline
Instrument manually on an APM-monitored app
For more information, see the instructions for your APM agent:
Create a browser app with NerdGraph API
Use the NerdGraph API to create a browser app manually. See this Nerdgraph tutorial.
Did this doc help with your installation?
Browser agent types: Lite, Pro, Pro+SPA
We have three types of browser agents: Lite, Pro, and Pro+SPA. The agent type has no impact on your billing.
Browser agent type
This is the default installed agent when you enable browser monitoring.
What it includes:
What it includes: Gives you access to the Browser Pro features.
What it doesn't include: Lacks the functionality designed for single page app monitoring.
What it includes: Gives you information about some basic page load timing and browser user information.
What it doesn't include: Lacks the Browser Pro features and SPA features.
Details about how agent types relate to pricing:
- Usage-based pricing: This pricing model has data ingest as a billing factor. If you want to reduce data ingest, you may want to consider downgrading to lesser agent types after install.
- Original pricing: Your access to browser monitoring features is gated by your subscription plan, not by the agent type. This means there is no reason not to use the default Pro+SPA agent.
After initial agent installation is finished, you can go to the App settings page to edit your configuration or to change your subscription.