BrowserTracker

Browser Tracker extends Core Tracker with a simplified constructor and some preconfigured Plugins.

tip

The recommended way of creating Browser Tracker Instances is to use either makeTracker or getOrMakeTracker.

These helper methods will also push the new instance in TrackerRepository and initiate auto-tracking automatically.

Configuration​

BrowserTrackerConfig

typedefault value
requiredapplicationIdstring
optionaltrackerIdstringSame value as applicationId
optionalqueueTrackerQueueThe result of makeBrowserTrackerDefaultQueue
optionalendpointstring
optionaltransportTrackerTransportThe result of makeBrowserTrackerDefaultTransport
optionalpluginsTrackerPluginsThe result of makeBrowserTrackerDefaultPluginsList
optionalactivebooleantrue
optionalanonymousbooleanfalse
optionaltrackApplicationContextbooleantrue
optionaltrackHttpContextbooleantrue
optionaltrackPathContextFromURLbooleantrue
optionaltrackRootLocationContextFromURLbooleantrue
optionaltrackApplicationLoadedEventbooleantrue
caution

endpoint and transport are mutually exclusive. While both optional, either one must be specified.

When providing only endpoint, the Tracker will automatically create a Transport configuration initialized with it.

Active state​

Trackers may be configured using the active option and modified at runtime via the setActive method.

active​

Determines whether the tracker will initialize as active or not. Inactive trackers don't track any Events.

setActive​

Allows to programmatically change the tracking state at runtime. This will re-initialize Queue, Transport and Plugins.

Anonymous mode​

Anonymous tracking may be configured using the anonymous option and modified at runtime via the setAnonymous method.

anonymous​

Determines whether the tracker will initialize in anonymous mode or not. In anonymous mode:

  • No cookies are created client side, nor sent by the remote Collector.
  • The remote Collector will anonymize all HttpContext attributes (remote_address, user_agent).
  • A volatile client session is generated by the Tracker. It will last only until the App is closed, or refreshed.

setAnonymous​

Allows to programmatically change anonymous mode at runtime. This will re-initialize Queue, Transport and Plugins.

Transport​

Fetch + XMLHttpRequest Transport Switch.

Queueing​

TrackerQueue is configured to send events in batches of 10 every 100ms.

Persistence​

TrackerQueue is configured to use LocalStorage to ensure events are persisted across sessions.

Retry logic​

Configured for 10 retries with exponential backoff starting at 1000ms.

Included plugins​

Under the hood​

To get an idea of how much Browser Tracker automates under the hood, this statement:

 const tracker = new BrowserTracker({ 
  applicationId: 'app-id', 
  endpoint: 'https://collector.app.dev'
});

is equivalent to:

const trackerId = trackerConfig.trackerId ?? trackerConfig.applicationId;
const fetchTransport = new FetchTransport({ endpoint: 'https://collector.app.dev' });
const xhrTransport = new XHRTransport({ endpoint: 'https://collector.app.dev' });
const transportSwitch = new TransportSwitch({ transports: [fetchTransport, xhrTransport] });
const transport = new RetryTransport({ transport: transportSwitch });
const queueStorage = new LocalStorageQueueStore({ trackerId })
const trackerQueue = new TrackerQueue({ storage: trackerStorage });
const applicationContextPlugin = new ApplicationContextPlugin({ applicationId: 'app-id' });
const httpContextPlugin = new HttpContextPlugin();
const pathContextFromURLPlugin = new PathContextFromURLPlugin();
const rootLocationContextFromURLPlugin = new RootLocationContextFromURLPlugin();
const plugins = [
  applicationContextPlugin,
  httpContextPlugin,
  pathContextFromURLPlugin,
  rootLocationContextFromURLPlugin
];
const tracker = new Tracker({ trackerId, transport, queue, plugins });

see also