Webnn

This handles the full lifecycle of browser-based neural network inference using the Web Neural Network API. You get navigator.ml feature detection, MLContext and MLGraphBuilder setup, explicit device selection with power preferences, tensor dispatch and readback, and graceful fallback paths when hardware acceleration isn't available. It won't help with server-side inference or cloud APIs. The procedures walk through identifying browser entry points, choosing between direct WebNN graphs or adapting existing runtimes like ONNX Runtime Web, and wiring up UX states for unsupported browsers versus actual accelerated execution. Useful when you need local ML inference that respects privacy constraints and can't phone home.

skills.sh installs: 147
GitHub stars: 31
last updated: Jun 3, 2026

View on GitHub

Install

$ npx -y skills add webmaxru/agent-skills --skill webnn --agent claude-code

Installs into .claude/skills of the current project.

Files

WebNN

Procedures

Step 1: Identify the browser integration surface

Inspect the workspace for browser entry points, UI handlers, worker entry files, and any existing model-loading or inference abstraction layer.
Execute node scripts/find-webnn-targets.mjs . to inventory likely frontend files and existing WebNN markers when a Node runtime is available.
If a Node runtime is unavailable, inspect the nearest package.json, HTML entry point, framework bootstrap files, and worker entry files manually to identify the browser app boundary.
If the workspace contains multiple frontend apps, prefer the app that contains the active route, component, or user-requested feature surface.
If the inventory still leaves multiple plausible frontend targets, stop and ask which app should receive the WebNN integration.
If the project is not a browser web app, stop and explain that this skill does not apply.

SKILL.md on GitHub