Install on a website

For an ordinary site: your extension's landing page, your documentation, your marketing. If you are instrumenting an extension, use the Chrome or Firefox guide instead.

1. Install the package

npm install @analyticstrend/web

2. Initialise once

import { init } from "@analyticstrend/web";

const analytics = init({ writeKey: "wk_your_key_here" });

analytics.track("page_view");

init registers its own handlers for pagehide and for the tab becoming hidden, so queued events are sent as someone leaves. It also sends anything left over from a previous visit as soon as it starts.

Single-page applications need one extra line

init runs once per document load. If your site routes on the client — React Router, Vue Router, SvelteKit, anything that changes the URL without a full page load — then moving between pages fires nothing at all, and your page-view numbers will count first loads only.

Track it yourself on route change:

// React Router
import { useLocation } from "react-router";

useEffect(() => {
  analytics.track("page_view", { path: location.pathname });
}, [location.pathname]);

This is the single most common way a web integration ends up quietly wrong, because the numbers look plausible. They are simply counting something narrower than you think.

Storage that refuses to work

Safari's private browsing, a blocked third-party frame, and a site over its storage quota all make browser storage throw. The SDK falls back to an in-memory queue rather than failing: events still send during that visit, they just do not survive a reload. Your page is never taken down by our script.

Verify it

Load a page, then check the Events screen in your dashboard.