whalewatch-browser

Real user monitoring for Whale — core web vitals and page views from real browsers.

npm i whalewatch-browser

import { initWhaleRum } from 'whalewatch-browser'

initWhaleRum({
  key: 'whk_pub_…',        // publishable key — safe in page source
  service: 'vivar-web',
  project: 'vivar',
})

That's it. LCP, INP, CLS, FCP and TTFB are collected and flushed when the page is hidden (the only moment INP and CLS are final).

Options

| Option | Default | Meaning | |---|---|---| | key | — | Publishable ingest key. Write-only, RUM events only. | | service | — | App name, shown as the RUM service. | | project | default | Data-scope tag, matching your backend project. | | url | hosted ingest | Ingest base URL for self-hosted installs. | | sampleRate | 1 | Fraction of sessions to record, 0–1. |

Custom events

import { recordRumEvent } from 'whalewatch-browser'
recordRumEvent('checkout_step', 2, { plan: 'pro' })

Notes

• No cookies, no fingerprinting. The session id is a random value in sessionStorage; it dies with the tab and identifies nobody.
• Never breaks your page. Every path is wrapped; a failure costs the page nothing.
• Events are sent with sendBeacon as text/plain, which avoids a CORS preflight — beacons that need one are unreliable once a page is hiding.