AI in the Browser with Just JavaScript (No Backend Required)

This article was generated with the assistance of AI to help our volunteer team share valuable insights efficiently. While we've reviewed the content for accuracy, please let us know if you spot any errors or have additional insights to contribute!

Missed the talk? No stress!

We kicked off 2026 with a practical, browser-first look at running AI on-device, and it’s one of those talks that quickly changes how you think about what’s possible on the web.

Andrew (Tech Lead at Sinov8 Software Solutions) walked through how modern browser capabilities make it realistic to run fast, efficient AI directly in the browser — often without needing to ship user data to a backend.

What the session covered

We started with a quick FEDSA intro (Front End & Design South Africa), plus a thank-you to the sponsors who help keep the community running: KRS, NML, and IO Digital.

From there, Andrew got into the main event: why “AI in the browser” is finally viable now, and how you can start building with it.

Key topics included:

• Why web, why now: lower latency, reduced server costs, easier distribution (everyone already has a browser), and better privacy by keeping data on-device.

• What changed technically: the rise of WebGPU (a big step forward from the older, hackier WebGL era), plus mature WebAssembly support and a promising future with WebNN (for better access to CPU/GPU/NPU-style acceleration).

• Who’s already doing it: real-world examples like background removal and video effects, plus broader use cases like content moderation, extraction from documents, and recommendations.

Tools and approaches Andrew highlighted:

Andrew introduced a helpful mental model:

1. Author or find a model (often created in TensorFlow or PyTorch)

2. Convert/export it into a web-friendly format (e.g. ONNX or TF Lite)

3. Run it with a runtime (e.g. MediaPipe, ONNX Runtime Web, TensorFlow.js, TF Lite runtimes)

4. Use the device hardware (GPU via WebGPU, and eventually better NPU access through newer APIs)

He then showed how approachable this can be in practice via demos:

• MediaPipe hand tracking + gestures to trigger UI changes (thumbs up/peace/OK/fist mapped to actions)

• A playful gesture-controlled “Fruit Ninja” style demo using the same hand tracking pipeline

• A simple TensorFlow.js classifier running locally in the browser (classifying images as “clean” vs “dirty”) to demonstrate how little code is needed to load a model and run inference on user-provided images

Key Takeaways:

• On-device AI can materially improve UX: fewer API calls and reduced latency means faster, more responsive interfaces.

• Privacy gets simpler in many cases: when inference happens locally, users don’t need to upload sensitive inputs (like images or documents) to a server.

• Model size and performance matter: big models can hurt load time and responsiveness — your use case should drive the trade-offs.

• MediaPipe is a great entry point: it’s designed to be approachable, with ready-to-use real-time video/image/audio capabilities.

• Shipping models to the client has IP implications: running in-browser can expose your model to inspection, so it’s best suited to “experience enhancers” rather than your most proprietary core IP.

Watch the full session

If you want to see the demos in action (especially the gesture-controlled filters and game), it’s worth watching the full recording on YouTube. The live walkthrough makes the building blocks feel much more achievable.

Join our Discord for discussion and updates, and subscribe to our monthly newsletter to stay in the loop.