Speed Reader

Overview

Speed Reader is a personal project built to explore RSVP-based speed reading in the browser. It displays one word at a time at a configurable pace, training users to eliminate subvocalization and reduce eye movement — two of the biggest bottlenecks in reading speed.

The entire app runs client-side with no backend, packaged as a Progressive Web App for offline use. It was built with heavy assistance from Claude Code as an exercise in AI-enabled development workflows — using conversational AI as a coding partner for architecture decisions, implementation, and testing.

The Challenge

Most speed reading tools are either paywalled SaaS products or bare-bones demos with limited functionality. I wanted something that was:

• Free and open — no accounts, no subscriptions
• Multi-source — paste text, upload a PDF, or pick a book from a library
• Customizable — themes, fonts, and reading behavior all adjustable
• Offline-capable — works without a network connection after first load

Solution

I built a modular vanilla JavaScript application with no frontend framework. Each concern — playback, text processing, UI, settings, library, storage, and analytics — lives in its own module with a well-defined interface. A central orchestrator (app.js) wires the modules together through callbacks, keeping coupling low.

Content Sources

The app supports three ways to load text. Users can paste directly into a textarea, upload a PDF that gets processed client-side with PDF.js, or browse a curated selection of 20+ classic books from Project Gutenberg with search and category filtering.

Playback & Reading Experience

The RSVP engine renders one word at a time in the center of the screen. Speed ranges from 100 to 1,000 WPM with a practice mode that automatically ramps speed over time. Optional punctuation pausing inserts longer delays at sentence boundaries, and center-character highlighting draws the eye to the optimal fixation point of each word.

Theming & Customization

Six preset themes — Light, Dark, Sepia, Ocean, Forest, and High Contrast — are available out of the box, and users can create fully custom themes with their own color schemes. Typography options include 18+ font families (including accessibility-focused choices like Atkinson Hyperlegible and Lexend) with adjustable sizing. All preferences persist to localStorage.

Technical Highlights

Modular Architecture — Seven dedicated modules with clear responsibility boundaries and event-driven communication, all coordinated by a single orchestrator. No build step required — the app runs directly in the browser using ES6 modules.

Client-Side PDF Processing — PDF.js loads lazily from CDN and extracts text entirely in the browser, supporting 20+ page documents in seconds with no server round-trip.

PWA & Offline Support — A service worker with a network-first caching strategy enables full offline functionality after the initial visit.

Privacy-First Analytics — Minimal Google Analytics integration tracks only three events (paste, upload, library load) with IP anonymization enabled, ad personalization disabled, and automatic detection to skip tracking during automated tests.

Comprehensive Testing — 130+ Playwright tests run across Chromium, Firefox, WebKit, Mobile Chrome, and Mobile Safari, covering tab navigation, text loading, playback controls, keyboard shortcuts, library search, settings, sidebar navigation, progress tracking, error handling, and responsive layout.

Results

• Fully functional speed reading app with zero runtime dependencies beyond PDF.js
• 130+ automated tests across 5 browser/device targets
• Clean modular codebase with no framework lock-in
• PWA-ready with offline support and session persistence