Technical Briefing
How Neural Vision Works
Browser image classification with TensorFlow.js and MobileNet
Neural Vision uses a pre-trained MobileNet model in the browser. Once the user uploads an image, the app decodes it, runs inference, and renders top predictions with confidence scores.
Data Pathway
Input Image
MobileNet
Classification
1) Lazy model loading
The model is loaded once and cached. This avoids repeated network and initialization cost on every upload.
Model singleton
let modelPromise: Promise<mobilenet.MobileNet> | null = null;
function getModel() {
if (!modelPromise) {
modelPromise = mobilenet.load();
}
return modelPromise;
}2) Backend selection and inference
TensorFlow.js is initialized with a WebGL-first strategy. If WebGL is unavailable, it falls back to CPU.
Classification pipeline
await tf.ready();
try {
await tf.setBackend("webgl");
} catch {
await tf.setBackend("cpu");
}
const model = await getModel();
const image = document.createElement("img");
image.src = src;
await image.decode();
const results = await model.classify(image, 3);3) UX feedback
The experiment reports loading/classifying states and shows top 3 results so users can reason about confidence distribution, not just one label.
Mission Debrief
Runs fully client-side.
Uses pre-trained MobileNet features.
Confidence display makes output interpretable.