To get started with , you'll need to add our browser agent to the HTML of the views you want to monitor. The browser agent is a snippet of JavaScript code that monitors the performance of your app/site and sends that data to New Relic. You can add that code manually to your site, or use our APM agents to inject that code for you.
Before you begin
Before starting, you may want to check that your browser app meets our compatibility requirements.
Want to use our API to programmatically monitor your applications? See Browser monitoring with NerdGraph.
Install the agent
To install the browser agent: Go to one.newrelic.com > Add data > Browser and mobile > Browser monitoring and follow the instructions.
If you have questions about the install process, see Install methods.
Look for your data in New Relic
When you're done installing the browser agent, wait a few minutes and look for the data in our browser monitoring UI.
If it's been more than 15 minutes and you're not seeing data, see Troubleshooting.
What's next?
Ideas for next steps:
- View your app data on the Summary page.
- Now that you've instrumented with the browser agent, go deeper with your data with our Improve your website tutorial.
- Learn how to optimize your browser monitoring experience with our Best practices guide for browser monitoring.
Install methods
When it comes to adding the browser agent to your webpages, you have two deployment methods:
- APM + browser monitoring: Use one of our APM agents to auto-instrument browser monitoring
- Browser monitoring only: Add our browser agent manually as a JavaScript snippet to your front-end HTML
Here's some guidance on these two methods.
APM + browser monitoring
If you're using an APM (application performance monitoring) agent to monitor the backend of your browser app, then we'd recommend using this method. We recommend this option for non-SPA apps because the APM agent will automatically deploy the browser agent to every page of your website and you'll automatically get the latest version of the browser agent whenever you restart your APM agent.
If you want to customize APM agent behavior, you can use our APM agent APIs. Here are those docs:
Browser monitoring only
Use this method if you can't use APM for whatever reason, like if you have a SPA app, or if your APM agent isn't supported for auto-injection (as is true for Node.js and some Java apps). If you use this method, you'll receive a customized JavaScript snippet at the end of the install process in the New Relic UI, and you'll add that to the HTML of any pages you want to monitor in your app/site.
The JavaScript snippet should be pasted into the <head> tag of views in your app. The head tag typically handles third party scripts, fonts, and other elements that load on all your app pages, so you'll only need to paste it into one place. Paste it as close to the top of the <head> as possible, but after any position-sensitive META tags (such as X-UA-Compatible and charset). For more about the snippet placement, see JavaScript placement requirements.