Aloud

For the curious

A speech engine, an audio scheduler and a PDF reader, inside a browser extension.

Aloud is a TypeScript extension with no backend. From a cluttered web page to a spoken, highlighted sentence, every step runs on your machine.

  1. Content script

    Extract

    Mozilla Readability keeps the article; reading rules for each kind of site take out what's left of the clutter.

  2. Content script

    Plan

    Only what the page shows is kept. Each paragraph's language is decided, and the text is grouped into natural utterances mapped back to their exact place on the page.

  3. Worker pool

    Synthesise

    Neural voices run on ONNX Runtime Web: WebGPU where the browser allows it, parallel WebAssembly workers everywhere else, up to three voice models side by side.

  4. Web Audio

    Play and follow

    Audio is scheduled sample-accurately, back to back, while the sentence and the word are highlighted in place.

Three neural engines in a tab

Supertonic 3 (flow matching), Kokoro-82M (StyleTTS 2) and Piper (VITS), each with its own text front end and model format, behind one engine interface.

Reading rules as data

What to pass over on Wikipedia, WordPress, Substack, docs sites and more is a list of rules, not code, so it can grow without touching the reader.

Highlights that can't break the page

The CSS Custom Highlight API marks text without changing the page's DOM. Notes are anchored by their words, so they find their place again after the page is edited.

One codebase, three browsers

Firefox, Firefox for Android and Chromium from one Manifest V3 codebase built with WXT. Differences are detected as capabilities, not guessed from the browser's name.

Isolated from the page

Synthesis runs in a hidden extension frame that only accepts connections carrying a one-time ticket from the extension, so a hostile page can't drive it.

Tested by ear

Over 600 automated tests, and every engine change is checked by transcribing its audio with speech recognition. The samples on this page were made the same way.

  • TypeScript
  • WXT
  • Manifest V3
  • ONNX Runtime Web
  • WebGPU
  • WebAssembly
  • Web Audio
  • CSS Custom Highlight API
  • pdf.js
  • Mozilla Readability
  • eSpeak NG
  • Vitest
  • Playwright