wilsonpage/fastdom
Fastdom
Fastdom is a task scheduler and rendering optimizer designed to prevent layout thrashing by batching document reads and writes. It functions as a coordination system that separates document measurements and mutations into distinct queues, ensuring that asynchronous operations are executed in a way that minimizes browser reflows.
The project provides a performance profiling capability that detects improper document API access. By enforcing strict execution phases, it identifies layout thrashing bottlenecks and flags unauthorized DOM access occurring outside of the coordinated batching cycles.
The system manages the rendering workflow by aligning execution cycles with the browser refresh rate. It includes capabilities for grouping read-only operations and write operations, as well as a mechanism for cancelling pending tasks using unique identifiers.
The scheduler can be extended via a plugin system to add custom task types to the global execution pipeline.
Features
- Rendering Phase Coordination - Separates measurement and mutation tasks into distinct queues to optimize rendering performance and prevent layout thrashing.
- Web Performance Optimization Tools - Provides a coordination system that optimizes web application performance by batching DOM read and write operations.
- Dual-Queue Scheduling - Implements a dual-queue system to separate document reads and writes, preventing interleaved layout thrashing.
- Execution Phases - Uses sequenced execution phases to ensure all DOM measurements are completed before any mutations occur.
- High-Frame-Rate Rendering - Optimizes JavaScript rendering to ensure high frame rates by managing asynchronous document operations.
- Task Queues - Maintains a centralized architectural task queue to process pending operations sequentially during animation frames.
- Browser Reflow Management - Groups multiple document mutations into single updates to minimize the number of browser layout reflows.
- DOM Read Batching - Groups read-only document operations into a single queue to prevent layout thrashing.
- DOM Rendering Coordination - Manages the order of document measurements and mutations to ensure smooth animations and high frame rates.
- DOM Task Batching - Coordinates the separation of document measurements and mutations into distinct queues for optimized execution.
- DOM Write Batching - Groups write operations into a single queue to ensure they execute after all measurements to minimize reflows.
- Layout Thrashing Prevention - Prevents browser reflows and layout thrashing by batching DOM reads and writes via a task scheduler.
- Visual Update Coordination - Coordinates JavaScript callbacks with the browser's paint cycle using requestAnimationFrame to minimize reflows.
- UI Performance Debugging - Identifies layout thrashing bottlenecks by analyzing rendering timing and improper DOM API access.
- Job Execution Cancellations - Provides a mechanism to abort pending measurement or mutation jobs using unique identifiers.
- DOM Rendering Profilers - Detects improper DOM API access and identifies layout thrashing through strict execution phase enforcement.
- DOM Access Detection - Throws errors when sensitive DOM APIs are accessed outside the batching system to identify performance bottlenecks.
- DOM API Interception - Provides an interception layer to detect unauthorized DOM access occurring outside of coordinated batching cycles.
- Layout Thrashing Detection - Triggers errors when DOM APIs are called outside coordinated measurement and mutation cycles to detect thrashing.
- Rendering Phase Enforcement - Enforces a strict mode that throws errors when DOM APIs are accessed outside of designated measure or mutate phases.
