04. Frontend Deep Dive

Structure

File	Role
index.html	Layout, CDN deps (Tailwind, ORT, fonts)
app.js	Controllers, size estimates, warnings, metrics
style.css	Dark/glow theme
transliterate.js	Script maps + Unicode offset conversion

UI behaviors

• Language dropdowns filtered by model direction
• Dynamic download size from MODEL_SIZES
• Quantized + WebGPU → warning and prefer WASM
• Progress callbacks during multi-file load
• Metrics: load latency, TTFT, tok/s (excluding TTFT), total time
• Short setTimeout before translate so UI can repaint

No framework

ES modules imported directly; no React/Vite/pnpm in this repo.

Interview Q&A

Q: Why vanilla JS?
A: Static HF Space + Pages deploy with five files and zero build step.