MetrikStack
Sources

Browser script

The cookieless MetrikStack tracking script, under 1.5 kB, with single-page app support, custom events, time on page and scroll depth.

The browser script is the source every new site starts with. It is under 1.5 kB gzipped, has no dependencies, and uses no cookies, localStorage or sessionStorage.

Install

<script
  defer
  src="https://cdn.metrikstack.com/js/script.js"
  data-site="SITE_ID"
></script>

See Quickstart for the full walkthrough, including proxying the script through your own domain.

What it tracks

On load, and on every SPA navigation, it sends:

  • path, referrer
  • screen size, language
  • utm_* and ref query parameters (everything else is stripped)
  • the merge request_id, if one is present (see How merging works)
  • the navigator.globalPrivacyControl flag (gpc), recorded but never used to drop the event

On visibilitychange / pagehide it sends a leave event with time on page and scroll depth. It uses sendBeacon, so the event still goes out when the tab closes.

SPA support

The script patches history.pushState and listens for popstate, so route changes in single-page apps built with React, Vue, Svelte and the like are tracked as pageviews without extra code.

Custom events

<script>
  window.metrikstack.track('signup', { plan: 'pro' });
</script>

track(name, props?) sends a custom event with the given name and an optional flat object of string properties, associated with the current page and merge request_id.

Errors

An optional second script tag captures uncaught exceptions and adds a captureException helper; the dashboard groups them into issues. It is a separate file, so sites that don't use it don't download it. See Errors for the tag, the API and what is collected.

Local development

By default the script does nothing on localhost or file: origins, so local testing stays out of your production data. To track locally, add data-allow-local:

<script
  defer
  src="https://cdn.metrikstack.com/js/script.js"
  data-site="SITE_ID"
  data-allow-local
></script>

Reading the merge request id

If your server or edge sets a request id (see How merging works), the script picks it up automatically: first from <meta name="metrikstack-request-id">, then from performance.getEntriesByType('navigation')[0].serverTiming. The second works behind CDNs that strip custom response headers but pass Server-Timing through. The script needs no configuration for this.

On this page