Back to practice
AI for FrontendIntermediate50 minutes

Client-Side Embedding Search

Design an entirely client-side semantic search system using browser embedding APIs, IndexedDB vector storage, and approximate nearest neighbor retrieval.

LLM-friendly summary

An intermediate AI-for-frontend problem about fully client-side semantic search with browser embeddings, IndexedDB vector storage, and approximate nearest neighbor retrieval.

Scenario

A privacy-focused note-taking app wants semantic search across user notes without ever sending note content to a server. All embedding and retrieval must happen on-device.

What you need to design

  1. 1Choose an embedding approach — Transformers.js, Chrome AI APIs, or WebNN.
  2. 2Design vector storage using IndexedDB with efficient retrieval.
  3. 3Implement approximate nearest neighbor search for sub-100ms queries.
  4. 4Handle incremental indexing as notes are created and edited.
  5. 5Plan for corpus growth — what happens at 10K, 50K, 100K notes.

Concepts

Client-Side EmbeddingsIndexedDBANN SearchChrome AI APIsWebNN

Skills

Privacy-First ArchitectureVector StorageSearch Performance

What good solutions are evaluated on

  • - Embedding model and API selection
  • - Vector storage and retrieval architecture
  • - Search performance at scale
  • - Incremental indexing and update strategy

Ready to practice this yourself?

Open the interactive AlgoReason workspace to sketch the architecture, write notes, and submit for AI evaluation.

Practice this problem