Skip to content
RitimRitim docs

Quickstart

Five minutes, four steps.

1. Create a project

Section titled “1. Create a project”

Sign in to the dashboard, create a project, and give it the hostname your site serves from. A project is one site; the hostname is what the collector checks incoming measurements against, so a stray key pasted onto someone else’s page sends nothing.

The dashboard gives you a public project key that looks like P-ABC123. It identifies a project — it does not authorise anything, and it is meant to be visible in your page source.

2. Install the SDK

Section titled “2. Install the SDK”

Pick a path. The rest of these docs follow whichever you choose here — every sample on every page switches with these tabs.

  1. Install it.

    Terminal window
    npm install @ritim/browser-sdk

  2. Start it once, on the client.

    import { init } from '@ritim/browser-sdk';
    

    init({ projectKey: 'P-ABC123', sampleRate: 1 });

Where that call goes depends on your framework:

Next.jsA client component in the root layout.
NuxtA .client.ts plugin.

Anywhere else, put it in whatever runs once after your app mounts.

3. Confirm it is sending

Section titled “3. Confirm it is sending”

Turn on debug logging temporarily:

init({ projectKey: 'P-ABC123', sampleRate: 1, debug: true });

Load the page and watch the console:

[ritim] measurement sent { lcp: 1180, cls: 0.01, ttfb: 210, … }

In the network panel you should see a POST to the collector returning 202. It fires roughly two seconds after the page settles, not on unload — so stay on the page for a moment rather than clicking straight through.

If nothing happens, Verifying an install walks the three usual causes.

4. Remove the verification flags

Section titled “4. Remove the verification flags”

Drop debug, and set the sample rate back — either remove it to inherit the project’s rate, or set the value you want:

import { init } from '@ritim/browser-sdk';


init({ projectKey: 'P-ABC123' });

Measurements now flow. The dashboard shows p75 per metric once a handful have arrived; a p75 over three page views is not a number worth reading, so give it some traffic before drawing conclusions.

Then what

Section titled “Then what”
  • Label your deploys. See Releases — on some frameworks this has already happened without you doing anything.
  • Measure pull requests. The GitHub Action audits your preview deployment and comments the result on the PR.
  • Check the ceiling. The free plan’s monthly event allowance and what happens when you reach it are in Plans and limits.