Skip to content

JavaScript SDK

Zero-dependency, privacy-first analytics for any website. No build step, no package manager required — one <script> tag is enough for most sites.

Get your Site ID

Every snippet below needs a Site ID, from Integration Hub → Add New App → Web in the dashboard. Web apps do not need a secret key — the backend authenticates by checking that the request's Origin matches the domain you registered.

Option A — Zero-code (recommended)

Paste this once, right before </head> or </body>. It auto-tracks page views, including client-side route changes in SPAs, with no further code:

<script src="https://mitranalytics.dev/vendor/mitr.js"
        data-site-id="YOUR_SITE_ID"
        async defer></script>
AttributeDefaultPurpose
data-base-urlhttps://api.mitranalytics.dev/api/v1Override if your workspace uses a different API host.
data-auto-tracktrueSet to "false" to disable automatic page-view tracking.
data-debugfalseSet to "true" to log SDK activity to the console.

No-code platforms (WordPress, Shopify, Webflow, Squarespace, Wix): paste the same script tag into your site's "Custom Code" / "Header Scripts" / "Tracking Code" settings.

Option B — Developer / SPA usage

<script src="https://mitranalytics.dev/vendor/mitr.js"></script>
<script>
  Mitr.init('YOUR_SITE_ID', {
    baseUrl: 'https://api.mitranalytics.dev/api/v1', // optional
    autoTrack: true,                       // optional, default true
    debug: false,                          // optional
  });
</script>

API

Mitr.init(siteId, options?)      // call once, on page load
Mitr.track(eventType, metadata?) // custom event
Mitr.pageView(path?, metadata?)  // manual page view (auto-tracking covers most cases)
Mitr.identify(userId)            // tie future events to a real user
Mitr.reset()                     // call on logout — reverts to anonymous

identify/track/pageView never send raw IDs — the SDK hashes (SHA-256) the id client-side, salted with your Site ID, before it ever leaves the browser.

Framework examples

React (any SPA):

useEffect(() => { Mitr.init('YOUR_SITE_ID'); }, []);
// Route changes are auto-tracked — no per-route code needed.

Next.js (App Router) — app/layout.jsx:

'use client';
import Script from 'next/script';

export default function RootLayout({ children }) {
  return (
    <html><body>
      {children}
      <Script src="https://mitranalytics.dev/vendor/mitr.js" data-site-id="YOUR_SITE_ID" strategy="afterInteractive" />
    </body></html>
  );
}

Vue / Nuxt: add the same script tag to index.html (Vue) or nuxt.config.ts's app.head.script (Nuxt) — auto-tracking picks up Vue Router navigation the same way.

Custom events

Mitr.track('signup_completed', { plan: 'pro', source: 'homepage_cta' });
Mitr.track('checkout_completed', { value: 49.99, currency: 'USD' });

Identifying users (login/logout)

// After a successful login:
Mitr.identify(user.id);

// On logout:
Mitr.reset();

Resilience

Events are batched (flushed every 5s or every 10 events, whichever comes first) and persisted to localStorage between flushes — a page reload, a network blip, or the tab closing won't lose queued events. On tab close/hide, any remaining events are flushed via navigator.sendBeacon as a last resort.

Have questions about integration or security? Drop us a line directly.