@codeserk/forge-stats-app

App performance plugin for @codeserk/forge-stats, for browser apps (dashboards, single page apps). It re-exports the whole core client, so an app imports this package alone. Public websites that only need the web vitals use @codeserk/forge-stats-web-vitals instead; an app can use both, they send separate web and app events.

Installation

npm install @codeserk/forge-stats-app

Usage

import { appPerformance, init } from '@codeserk/forge-stats-app'

const appMetrics = appPerformance({ getRoute: () => router.currentRoute.pattern })
init({ sdk: 'YOUR_SDK_KEY', plugins: [appMetrics] })

A route is measured once every 5 h, across reloads (kept in localStorage): the visit is one Performance sample with context: app, named after the route pattern (getRoute returns the pattern, not the raw pathname), sent when the route changes or the page is hidden. Later visits within the 5 h send no sample and no spikes:

| Group | What | Browsers | |---|---|---| | frames | frame times (min, max, avg, count, hitches), from requestAnimationFrame | all | | startMs | first sample only: navigation to the first quiet page | all | | loadMs | first sample of a route: route change to the quiet page | all | | interactions | count (pointer and key downs) and slow (over 200 ms) | all; slow with Event Timing (Chromium, Firefox, Safari 26.2+) | | memory | used heap in MB | Chromium |

A load ends at its last request or DOM change, once nothing happened for 100 ms with no fetch or XMLHttpRequest in flight; one still busy after 30 s is dropped. Apps that know better call appMetrics.ready() when the content is shown, and pass waitForReady: true so only ready() ends a load.

Frames over 200 ms are freezes, sent as spike events with what the Long Animation Frames API saw in them as frames.causes: each script by file name, forced-layout and style-layout (Chromium only; other browsers send spikes without causes).

Every group can be turned off: samples, spikes, loads, interactions, memory, all on by default.