Syntax
newrelic.measure(name: string, options?: Object<{ customAttributes?: Object, start?: number|PerformanceMark, end?: number|PerformanceMark }>)Reports a browser BrowserPerformance event.
Requirements
Browser Pro or Pro+SPA agent (v1.291 or higher)
If you're using npm to install the browser agent, you must enable the
generic_eventsfeature when instantiating theBrowserAgentclass. In thefeaturesarray, add the following:import { GenericEvents } from '@newrelic/browser-agent/features/generic_events';const options = {info: { ... },loader_config: { ... },init: { ... },features: [GenericEvents]}For more information, see the npm browser installation documentation.
Description
This API call sends a browser BrowserPerformance event with your user-defined name and custom attributes. This is useful for manually creating an event as an alternative or alongside automatic marks and measures tracking.
Parameters
Parameter | Description |
|---|---|
string | Required. Name or category of the task. Reported as the Avoid using reserved NRQL words when you name the attribute or value. |
JSON object | Optional. An object used for supplying configurations for the captured event. All attributes in the object are optional. If Avoid using reserved NRQL words in custom attributes. |
Return values
This method returns a JSON object with measurement details. start is the start time. end is the end time. duration is the length of the measurement from start to end. customAttributes are custom attributes passed into the measure API call. The custom attributes returned are not merged with user-defined custom attributes, but they are merged when creating the BrowserPerformance event.
Examples
Minimal example
const myTask = newrelic.measure('checkout')/** myTask **/{ start: 0, // page origin time was used since start was not supplied end: 1234, // performance.now() was used since end was not supplied duration: 1234, // end - start customAttributes: { } // no custom attributes were supplied}/** the browser agent buffers and later harvests the newly created BrowserPerformance event **/Using number arguments for start and/or end time
const myTask = newrelic.measure('checkout', { start: 1234, end: 5678})/** myTask **/{ start: 1234, // options.start time was used directly end: 5678, // options.end time was used directly duration: 4444, // end - start customAttributes: { } // no custom attributes were supplied}/** the browser agent buffers and later harvests the newly created BrowserPerformance event **/Using PerformanceMark arguments
const startMark = performance.mark('my-start-mark') // startTime = 1234// laterconst endMark = performance.mark('my-end-mark') // startTime = 5678const myTask = newrelic.measure('checkout', { start: startMark, end: endMark})/** myTask **/{ start: 1234, // options.start.startTime was used since it was a BrowserPerformance entry end: 5678, // options.end.startTime was used since it was a BrowserPerformance entry duration: 4444, // end - start customAttributes: { } // no custom attributes were supplied}/** the browser agent buffers and later harvests the newly created BrowserPerformance event **/Mixed argument types
const startMark = performance.mark('my-start-mark') // startTime = 1234const myTask = newrelic.measure('checkout', { start: startMark, end: 5678})/** myTask **/{ start: 1234, // options.start.startTime was used since it was a BrowserPerformance entry end: 5678, // options.end time was used directly duration: 4444, // end - start customAttributes: { } // no custom attributes were supplied}/** the browser agent buffers and later harvests the newly created BrowserPerformance event **/Using custom attributes
const myTask = newrelic.measure('checkout', { start: 1234, end: 5678, customAttributes: { foo: 'bar' }})/** myTask **/{ start: 1234, // options.start time was used directly end: 5678, // options.end time was used directly duration: 4444, // end - start customAttributes: { foo: 'bar' }}/** the browser agent buffers and later harvests the newly created BrowserPerformance event **/