demo · v131
two device pipelines, two workers, no main-thread jitter
A high-frequency joystick + a haptic gamepad together can saturate a single thread reading HID reports. Spawning each on its own worker (each calling navigator.hid) keeps the main thread at 60fps for animation. This page simulates two HID streams arriving at different cadences and shows the main thread's frame-time staying flat.
worker 1 — high-rate joystick
awaiting messages
worker 2 — gamepad with haptics
awaiting messages
main thread frame time (smaller is smoother)
—
the api
// dispatch one worker per device class
const joystick = new Worker("hid-joystick.js", { type: "module" });
const gamepad = new Worker("hid-gamepad.js", { type: "module" });
// hid-joystick.js (runs in worker)
const [device] = await navigator.hid.requestDevice({ filters: [{ usagePage: 0x0001, usage: 0x0004 }] });
await device.open();
device.addEventListener("inputreport", e => {
// process in worker, post deltas to main
self.postMessage({ x: e.data.getInt8(0), y: e.data.getInt8(1) });
});