Glasp

Captures text selections and highlights from web articles through a browser extension that injects DOM event listeners into the page context. When users select text, the extension intercepts the selection event, extracts the highlighted content along with metadata (URL, timestamp, article title), and stores it in a local/cloud database with visual annotation markers persisted in the browser's extension storage. The implementation uses MutationObserver patterns to track DOM changes and maintain highlight positions across page reloads.

Extends highlight capture to YouTube videos by detecting video player context and mapping text selections to specific timestamps. The extension injects a custom UI overlay into the YouTube player, captures the current playback time when a highlight is made, and stores highlights as structured objects containing video ID, timestamp range, selected text, and context. Uses YouTube's iframe API to track playback state and enables seeking to highlight timestamps directly from the knowledge library.

Processes collections of highlights through an LLM API (likely OpenAI or similar) to generate abstractive summaries, key takeaways, and thematic clustering. The extension batches highlights by source (article, video, or topic tag) and sends them to a backend service that calls an LLM with a prompt template optimized for summarization. Results are cached and stored alongside the original highlights, with options to regenerate summaries with different prompt parameters or LLM models.

Implements a social layer where users can publish their highlights to a community feed, discover highlights from other curators on the same articles or topics, and follow curators with similar interests. The backend maintains a public database of highlights indexed by article URL, video ID, and topic tags, with a recommendation algorithm that surfaces highlights based on user's reading history and followed curators. Highlights can be marked as public or private, and users can see aggregated highlight statistics (e.g., 'highlighted by 47 other users').

Provides a hierarchical tagging and folder-based organization system for highlights, allowing users to create custom tags, nested collections, and color-coded categories. Tags are stored as metadata on each highlight object and indexed for full-text search. The UI allows bulk tagging, tag suggestions based on highlight content and existing tags, and dynamic filtering by multiple tags with AND/OR logic. Tags can be synced across devices through the cloud account.

Synchronizes highlights across multiple devices (desktop, mobile, tablet) through a cloud backend that stores highlights in a user's account. When a highlight is created on one device, it is uploaded to the cloud backend and automatically downloaded to other devices where the Glasp extension is installed. Sync uses differential updates (only changed highlights are synced) to minimize bandwidth. Offline mode allows local highlight creation that is queued and synced when connectivity is restored.

Exports highlights in multiple formats (JSON, CSV, Markdown, HTML) and integrates with external tools like Notion, Obsidian, and Roam Research through API connectors or manual export. The export process batches highlights by source or tag, formats them according to the target tool's schema, and uploads them via API or generates a downloadable file. Markdown export includes source links and timestamps for easy import into note-taking apps.

Indexes all highlight text and metadata (source, tags, author) in a full-text search engine (likely Elasticsearch or similar) and provides a search interface that returns matching highlights with relevance ranking. Search supports boolean operators (AND, OR, NOT), phrase matching, and filtering by tag, source, or date range. Search results are ranked by relevance and recency, with highlighting of matching terms in the result preview.

Captures and stores surrounding context (preceding and following sentences) when a highlight is created, enabling users to understand the highlight's meaning without re-reading the original source. Context is extracted from the DOM at highlight time and stored as metadata. When viewing a highlight, users can expand to see the full context, and the extension can generate a context-aware summary using the LLM if needed.