Browser overview

@idlekitjs/browser contains browser runtime bridges: each brick connects one browser API to an IdleKit engine contract. The engine only knows its headless contracts (FrameScheduler, pause()/resume(), typed events); this package produces them from real browser APIs.

Not rendering: the DOM renderer and bindings live in @idlekitjs/dom. The rule of thumb — writes to the DOM → dom; reads or bridges a browser API → browser.

The catalog

Brick	Bridges	To
Page lifecycle	Page Visibility API	pause()/resume() + resume event
createRafScheduler (API)	requestAnimationFrame	FrameScheduler
Screen helpers (API)	window.devicePixelRatio	CSS ↔ device pixel conversion

import { pageLifecycle } from "@idlekitjs/browser/page-lifecycle";
import { createRafScheduler } from "@idlekitjs/browser/raf-scheduler";
import { devicePixelRatio } from "@idlekitjs/browser/screen";

Why a dedicated package

Browser APIs all follow the same shape here: browser API in, engine contract out. Giving them one home keeps @idlekitjs/dom strictly about rendering and keeps operational policies in @idlekitjs/plugins focused on engine behavior.

All bricks are SSR/headless-safe: without document/window they no-op or fall back, so shared wiring code needs no environment branches.