Guardrails· ▶ Playable
Canary
A browser game where you are the attacker: sneak a prompt injection past a guardrail that runs 100% on your device. A layered pipeline (normalization, heuristics, a 22M ONNX classifier) returns BLOCKED or PASS with a confidence score and the layer that caught you.
- Transformers.js
- ONNX
- Llama Prompt Guard 2 (22M)
- React
- TypeScript
- Vite
- Tailwind v4
- Zustand
Problem
LLM apps need a prompt-injection guard, but a hosted one costs money, adds latency, and ships user text to a server. Can a useful guardrail run with zero backend, on any device, including phones, and stay honest about being bypassable? That last part matters: a guard that oversells itself is worse than no guard.
My role
Designed and built the whole thing spec-first as a layered, client-side defense (OWASP LLM01). A pipeline, not a single model call: Unicode NFKC normalization plus zero-width and homoglyph stripping and base64/leet decoding, an explainable regex/denylist of known injection patterns, then Meta's Llama Prompt Guard 2 (22M, DeBERTa-xsmall) as a quantized ~72 MB ONNX model running in-browser via Transformers.js on WASM/CPU, and a score-fusion stage that returns a calibrated BLOCKED/PASS with a confidence and the exact layer that fired. Wrapped it in a game: each round assigns an intent (infiltrate vs stress-test) so a PASS is meaningful, with a lenient intent gate, separate from the guard, that kills the "type hola and win" loophole.
Tradeoff
Chose a 22M encoder classifier over a generative guard LLM. That gives up some recall and all non-English coverage, and the model runs on WASM/CPU because ORT's WebGPU path silently miscomputes this int8 model. In return: roughly $0 to run, sub-second inference, full privacy (nothing leaves the device), and it works on a phone. The heuristic layer buys back recall on the blatant, well-known attacks the small model would wave through, and normalization kills the obfuscation tricks that fool both. No single stage is trusted alone.
Metric
The quantized classifier reports precision 0.997 / recall 0.920 in English (vendor-reported on a jailbreak set), so it rarely false-flags but misses some attacks, which is exactly why the pipeline is layered. v1 ships fully client-side, ~$0, offline after first load, with the model cached in the browser. What I would measure next: end-to-end pipeline recall on an adversarial/obfuscated set, and the false-positive rate on benign English and Spanish text. The UI states the honest limit: v1 detection is English-effective.