A naukri.com initiative
Medium
2w
122
Image Credit: Medium
Getting Accurate Time with JavaScript Performance.now
- JavaScript offers two options for timekeeping: Date.now() and performance.now(). While Date.now() is tied to the system clock and returns whole milliseconds, performance.now() measures time passed since page load in decimal milliseconds, enabling tracking of small gaps.
- performance.now() provides more precision, highlighting milliseconds in decimals that Date.now() would miss. It starts counting from page load, unaffected by system clock changes, making it more reliable for measuring execution time.
- Date.now() can lead to inaccuracies due to system clock shifts, making it unreliable for real-time duration measurements, unlike performance.now() which maintains a steady timeframe irrespective of external factors.
- Browsers utilize stable system-level timers like QueryPerformanceCounter to ensure consistent readings for performance.now(), enabling reliable benchmarking even under heavy CPU use or changing system conditions.
- While performance.now() excels at measuring small time intervals precisely, browsers limit its resolution in certain contexts to mitigate timing attacks, rounding values or introducing jitter in some situations.
- precision gets adjusted based on where code runs, headers like Cross-Origin-Opener-Policy and Cross-Origin-Embedder-Policy influence accuracy of performance.now() readings, ensuring safer data sharing environments.
- To minimize noise and enhance accuracy with performance.now(), repeating code execution and averaging results are recommended for better insights on function speed and performance, especially for microseconds-level functions.
- requestAnimationFrame(), utilizing the same high-resolution clock as performance.now(), aids in monitoring frame updates and identifying lag spikes, offering a comprehensive picture of page performance and potential bottlenecks.
- Pairing performance.now() with requestAnimationFrame() enhances performance analysis, enabling developers to pinpoint code segments causing delays and make timely adjustments for smoother animations and better user experience.
- performance.now() stands out for reliable time measurements, steering clear of system clock discrepancies and offering a precise tool for benchmarking, animation tracking, and code performance analysis in JavaScript applications.
Read Full Article
7 Likes
For uninterrupted reading, download the app