Overview
WhatsApp Chat Viewer is an offline-first browser application designed to parse, search, and display exported WhatsApp chat text files locally in the browser with zero server data upload.
π― Problem & Motivation
Exported WhatsApp text archives can contain hundreds of thousands of lines. Attempting to parse and render hundreds of thousands of HTML elements directly into a single page crashes browser memory tabs.
βοΈ Technical Solution
By offloading file parsing to a Web Worker thread and using DOM Virtualization (Windowing), only the small subset of messages currently visible in the viewport are rendered, enabling smooth scrolling through large chat logs.
ποΈ Architecture & Threading Model
- Web Worker Threading: Runs regex message parsing in a separate background thread to keep the main UI thread lag-free.
- DOM Virtualization (Windowing): Dynamically calculates scroll height and mounts only visible message components.
- IndexedDB Storage: Persists parsed index metadata locally so returning users open chats without re-parsing.
- 100% Client-Side Privacy: Zero data transmitted to external servers.
βοΈ Challenges & Trade-offs
Trade-off: DOM Virtualization requires fixed or pre-calculated message item heights, requiring dynamic height measuring calculations when handling multiline messages or media attachments.
π‘ Lessons Learned
1. Web Workers are essential for processing multi-megabyte text files without freezing UI event loops.
2. DOM Virtualization is the single most impactful technique for web list rendering performance.
π Planned Improvements
- Planned Full-text search indexing across message archives.
- Planned Export options for parsed chat metrics and analytics graphs.