New Relic Browser and the Java agent

New Relic Browser gives you visibility into how your users are interacting with your Java application by using a JavaScript snippet (or "agent") to instrument your app's webpages. You can enable New Relic Browser for use with the Java agent in several ways:

Before you enable New Relic Browser for use with the Java agent, make sure you are using the latest version of the Java agent.

Enable via APM

To enable New Relic Browser on an app that is already monitored by New Relic APM, automatically inject the JavaScript snippet via APM. This is the easiest way to install the agent for an app that New Relic APM already monitors.

Enable via the copy/paste method

To insert the Browser JavaScript snippet into your app's webpages yourself, use the copy/paste method. This allows you to control the exact placement of the JavaScript snippet.

Enable via the REST API

To enable multiple apps, use the REST API. This is useful for larger organizations deploying multiple apps or for integration partners that are facilitating New Relic Browser monitoring.

Manually instrument via the Java agent API

If your framework does not allow you to enable via APM, with the copy/paste method, or via the REST API, you can manually instrument New Relic Browser via the Java agent API.

  1. Disable auto-instrumentation.
    Disable auto-instrumentation on all pages
    1. Set the auto_instrument flag under browser_monitoring to false in your newrelic.yml.
      browser_monitoring:
        auto_instrument: false
    2. Restart your application.
    3. Flush the app server's work cache.

    Flushing the work cache forces the app server to recompile JSPs, which is when auto-instrumentation occurs.

    Disable auto-instrumentation only on specific pages

    Use the disabled_auto_pages flag under the browser_monitoring stanza. For example, to disable auto-instrumentation on testpage_1.jsp and testpage_2.jsp, use the following:

     browser_monitoring:
       disabled_auto_pages: /WEB-INF/jsp/testpage_1.jsp, /WEB-INF/jsp/testpage_2.jsp
    
  2. Access the Java agent API class by adding newrelic-api.jar to your application class path.
  3. Add the appropriate method to start time tracking, for example: com.newrelic.api.agent.NewRelic.getBrowserTimingHeader().

    Add the appropriate method to stop time tracking, for example: com.newrelic.api.agent.NewRelic.getBrowserTimingFooter().

    Find the appropriate methods based on the framework you are using:

    JSP manual instrumentation
    Insert the header as close to the top of <head> tag as possible but after the meta tags. Insert the footer before the </body> tag.
    <!DOCTYPE html>
    
    <html>
    <head><title>EXAMPLE</title></head>
    <meta charset="utf-8">
    <meta name="description" content="Example header and footer call">;
    <%= com.newrelic.api.agent.NewRelic.getBrowserTimingHeader() %>
    <body>
    
    <%= com.newrelic.api.agent.NewRelic.getBrowserTimingFooter() %>
    </body>
    </html>
    
    Raw HTML manual instrumentation
    To manually instrument using raw HTML, include page load timing code in the HTTP response.
    Thymeleaf 2.1 or higher manual instrumentation
    <head>
    ...
    <div th:remove="tag" th:utext="${T(com.newrelic.api.agent.NewRelic).getBrowserTimingHeader()}"></div>
    </head>
    <body>
    ...
    <div th:utext="${T(com.newrelic.api.agent.NewRelic).getBrowserTimingFooter()}"></div>
    </body>
    
    ColdFusion CFML page manual instrumentation
    <cfobject type="Java" class="com.newrelic.api.agent.NewRelic" name="newRelic"/>
    <cfset header = newRelic.getBrowserTimingHeader() />
    <cfoutput>#header#</cfoutput>
    ...
    ...
    <cfset footer = newRelic.getBrowserTimingFooter() />
    <cfoutput>#footer#</cfoutput>
    
    Java Server Faces (JSF) frameworks

    Manual instrumentation is not available with JSF. To insert the Browser JavaScript snippet into your app's webpages, use the copy/paste method.

    Play Groovy template manual instrumentation
    ${com.newrelic.api.agent.NewRelic.getBrowserTimingHeader().raw()}
    ...
    ...
    ${com.newrelic.api.agent.NewRelic.getBrowserTimingFooter().raw()}
    
    Play 2.2 or higher Scala template manual instrumentation

    Add the following to build.sbt, substituting the latest agent version for 3.x.x:

    libraryDependencies += "com.newrelic.agent.java" % "newrelic-api" % "3.x.x"

    In main.scala.html, add the following:

    @Html(com.newrelic.api.agent.NewRelic.getBrowserTimingHeader())
    ...
    ...
    @Html(com.newrelic.api.agent.NewRelic.getBrowserTimingFooter())
    
    Play 2.1 Scala template manual instrumentation

    Add the following to Build.scala, substituting the lastest agent version for 2.x.x:

    appDependencies += "com.newrelic.agent.java" % "newrelic-api" % "2.x.x"
    

    In main.scala.html, add the following:

    @Html(com.newrelic.api.agent.NewRelic.getBrowserTimingHeader())
    ...
    ...
    @Html(com.newrelic.api.agent.NewRelic.getBrowserTimingFooter())**Manual instrumentation with Apache Velocity Template Language (VTL)**
    
    Apache Velocity Tools manual instrumentation

    If you are using Velocity Tools, define a NewRelic tool in toolbox.xml:

    <toolbox>
      <tool>
        <key>NewRelic</key>
        <scope>application</scope>
        <class>com.newrelic.api.agent.NewRelic</class>
      </tool>
    </toolbox>
    

    Call the NewRelic API in your velocity template:

    $NewRelic.getBrowserTimingHeader()
    ...
    ...
    $NewRelic.getBrowserTimingFooter()
    
    Apache Velocity manual instrumentation
    1. To ensure that all of your Browser page views are not grouped under a single /velocity transaction (and to avoid metric grouping issues), disable your enable_auto_transaction_naming setting in your newrelic.yml file:

      enable_auto_transaction_naming: false
      
    2. Add newrelic-api.jar to the classpath of Tomcat, typically in .../tomcat/bin/setenv.sh:

      CLASSPATH=$CLASSPATH:/opt/newrelic/newrelic-api.jar
      

      OR

      Add the reference to this jar file to the end of an existing CLASSPATH=... line within that file.

    3. In each app, find WEB-INF/tools.xml and add the following tag:

      <toolbox scope="application"> <tool class="com.newrelic.api.agent.NewRelic" key="NewRelic" /> </toolbox>
      

      If a <toolbox scope="application"> tag already exists, put the <tool ... /> within the tag.

    4. In each app, edit the Velocity template that the other pages in the application use. Add this tag within the <head> stanza before any <link> and <script> declarations and after any meta tags:
      $NewRelic.getBrowserTimingHeader()
    5. Add this tag within the <body> stanza as the line right before the </body> tag, at the very bottom of the body:

      $NewRelic.getBrowserTimingFooter()
      
    6. Restart the Tomcat server:
      • If you are using Linux/Unix, add the following command line to the Users/Tomcat/bin directory:

        ./shutdown.sh
        ./startup.sh
        
      • If you are using Windows, go to your Users/Tomcat/bin directory, and add the following command line:
        % shutdown.bat
        % startup.bat
        
  4. Check the log file to verify that the agent is instrumenting correctly. Set the log_level setting in newrelic.yml to log_level: finer and check for the following messages:
    When the JSP engine compiles a JSP
    May 17, 2011 9:33:18 AM NewRelic FINE: Compiling JSP: /jsp/header.jsp
    May 17, 2011 9:33:18 AM NewRelic FINE: Injecting browser timing header into: /jsp/header.jsp
    
    May 17, 2011 9:33:36 AM NewRelic FINE: Compiling JSP: /jsp/footer.jsp
    May 17, 2011 9:33:36 AM NewRelic FINE: Injecting browser timing footer into: /jsp/footer.jsp
    
    After the agent connects to the server
    The JavaScript snippet is not inserted into the HTML response until after the agent connects to the server.
    May 17, 2011 9:43:21 AM NewRelic INFO: Real user monitoring is enabled with auto instrumentation
    
    When New Relic invokes the JSP
    May 17, 2011 9:43:23 AM NewRelic FINER: Injecting browser timing header in a JSP.  Content type is text/html
    May 17, 2011 9:43:23 AM NewRelic FINER: Injecting browser timing footer in a JSP.  Content type is text/html
    
    May 17, 2011 9:43:23 AM NewRelic FINEST: Got browser timing header in NewRelic API: <script>var    NREUMQ=[];NREUMQ.push(["mark","firstbyte",new Date().getTime()]);(function(){var d=document;var e=d.createElement("script");e.type="text/javascript";e.async=true;e.src="https://d7p9czrvs14ne.cloudfront.net/11/eum/rum.js";var s=d.getElementsByTagName("script")[0];s.parentNode.insertBefore(e,s);})();</script>
    
    May 17, 2011 9:43:23 AM NewRelic FINEST: Got browser timing footer in NewRelic API: <script type="text/javascript" charset="utf-8">NREUMQ.push(["nrf2","staging-beacon-1.newrelic.com","8512b4d93f",7449,"M1RTYksFDEYDUxdcDgoeZERQSwhGEmQGRhVL",0,413])</script>
    

For more help

Recommendations for learning more: