New Web App for Image Classification

Web Development
Machine Learning
New Web App for Image Classification

Building a Web App for Image Classification

I’ve been working on a new web application that brings the power of image classification directly to the browser. Using TensorFlow.js, this tool allows users to upload images and get instant classification results without sending data to a server.

Why Build This?

While there are many image classification services available, most require:

  1. API keys and authentication
  2. Sending data to external servers
  3. Managing usage quotas and costs

I wanted something simple, private, and accessible - hence this browser-based solution.

Technical Implementation

The app uses a pre-trained MobileNet model available through TensorFlow.js:

import * as tf from '@tensorflow/tfjs';
import { MobileNet } from '@tensorflow-models/mobilenet';

// Load model
const model = await mobilenet.load();

// Classify image
const imgElement = document.getElementById('input-image');
const predictions = await model.classify(imgElement);

// Display top predictions
predictions.forEach(prediction => {
  console.log(`${prediction.className}: ${prediction.probability.toFixed(4)}`);
});

Performance Considerations

Running machine learning models in the browser presents unique challenges:

  • Model size - Balancing accuracy with download size
  • Inference speed - Optimizing for quick predictions
  • Browser compatibility - Ensuring wide support across devices

For this project, I chose MobileNet because it strikes a good balance between accuracy and performance, with a model size of just ~16MB.

User Experience

The interface is straightforward:

  1. Drag and drop or select an image
  2. Wait for processing (typically under a second)
  3. View the top predictions with confidence scores

I’ve also added visual indicators for the detection regions and a history feature to compare previous classifications.

Future Enhancements

I’m planning to add:

  • Support for custom models
  • Batch processing
  • Export/share functionality
  • Progressive loading for slower connections

Try It Out

The application is live at imageclassifier.stridelabs.ai - feedback is welcome!