EfficientWordnet Offline Frontend

EfficientWordnet Offline is a privacy-first, 100% in-browser hotword (wake word) detection dashboard. It brings the power of EfficientWord-Net to the web, allowing users to test and create wake words entirely locally without any audio data ever leaving their device.

🚀 Key Features

• Real-time Hotword Detection: Detect wake words like "Alexa" or "Mycroft" directly in your browser.
• Privacy by Design: Audio processing happens locally using ONNX Runtime Web. No cloud APIs, no data collection.
• Custom Hotword Factory: Record your own samples or upload audio files to generate custom hotword reference (.json) files.
• Cross-Platform: Works on any modern browser supporting Web Audio API and WASM.
• Adjustable Sensitivity: Fine-tune detection thresholds to balance between false triggers and accuracy.

🛠️ Technology Stack

• Framework: React 19 + TypeScript
• Build Tool: Vite
• Inference Engine: ONNX Runtime Web
• Audio Processing:
  • Web Audio API (AudioWorklet)
  • Mel-frequency Filterbank processing
  • fft.js for spectral analysis
• UI Components: Lucide React (Icons), Sonner (Toasts), Tailwind CSS

📦 Getting Started

Prerequisites

• Node.js (Latest LTS recommended)
• npm or yarn

Installation

1. Clone the repository:

   git clone https://github.com/Ant-Row/EfficientWordnet-Frontend.git
   cd EfficientWordnet-Frontend

2. Install dependencies:

   npm install

3. Start the development server:

   npm run dev

4. Build for production:

   npm run build

🧠 How It Works

1. Audio Capture: The browser captures audio at 16kHz via a dedicated AudioWorklet.
2. Feature Extraction: Audio buffers are processed into log-mel spectrograms using a Mel-filterbank (64 filters, 512 NFFT).
3. Inference: The processed features are fed into a ResNet-50 based Siamese Network (ONNX model).
4. Comparison: The resulting embedding is compared against reference embeddings using Cosine Similarity.
5. Detection: If the similarity score exceeds the user-defined threshold, a detection event is triggered.

📁 Project Structure

• src/components/: UI Tabs for testing and creating hotwords.
• src/lib/AudioUtils.ts: Core logic for Mel-filterbank and audio framing.
• public/audio-processor.js: AudioWorklet script for low-latency audio capture.
• public/models/: Contains the ONNX model and default reference files.

📝 License

This project is licensed under the MIT License - see the LICENSE file for details.

---

Built with ❤️ and Gemini for privacy and the open-source community.