--- id: wiki-2026-0508-high-resolution-time title: High Resolution Time category: 10_Wiki/Topics status: verified canonical_id: self aliases: [performance.now, Monotonic Time, HR Time, Hi-Res Timer] duplicate_of: none source_trust_level: A confidence_score: 0.9 verification_status: applied tags: [web-api, performance, timing, security] raw_sources: [] last_reinforced: 2026-05-10 github_commit: pending tech_stack: language: JavaScript/C framework: W3C-HRTime/POSIX --- # High Resolution Time ## 매 한 줄 > **"매 sub-millisecond 정밀도의 매 monotonic clock"**. W3C High Resolution Time spec — `performance.now()` 가 매 `Date.now()` 의 ms 한계 + wall-clock jitter 를 매 해결. 매 Spectre 후 — 모든 brower 가 매 timer 정밀도를 매 100µs ~ 1ms 로 매 reduce + cross-origin isolation 으로 매 5µs 회복. ## 매 핵심 ### 매 vs Date.now - `Date.now()`: wall clock, ms 단위, NTP 으로 점프 가능 (음수 delta!). - `performance.now()`: monotonic, fractional ms, navigation start 기준. ### 매 timer attack mitigation - Spectre/Meltdown (2018) → 매 brower 가 timer fuzz/round. - Default: 100µs ~ 1ms rounding + jitter. - COOP+COEP (cross-origin isolated) 시 → 5µs 정밀 + `SharedArrayBuffer`. ### 매 응용 1. Animation frame timing (`rAF` callback). 2. Performance profiling (`User Timing API`). 3. WebGL/WebGPU frame budget tracking. 4. Audio scheduling (`AudioContext.currentTime` 동기). ## 💻 패턴 ### Basic timing ```javascript const t0 = performance.now(); heavyWork(); const elapsed = performance.now() - t0; console.log(`took ${elapsed.toFixed(3)} ms`); // 12.345 ms ``` ### User Timing API (DevTools 표시) ```javascript performance.mark('render-start'); render(); performance.mark('render-end'); performance.measure('render', 'render-start', 'render-end'); const [m] = performance.getEntriesByName('render'); console.log(m.duration); // Visible in Chrome DevTools Performance panel. ``` ### Frame budget tracker ```javascript let lastT = performance.now(); function frame(now) { const dt = now - lastT; lastT = now; if (dt > 16.7) console.warn(`slow frame: ${dt.toFixed(1)}ms`); requestAnimationFrame(frame); } requestAnimationFrame(frame); ``` ### Cross-origin isolated (max precision) ```http # Server response headers Cross-Origin-Opener-Policy: same-origin Cross-Origin-Embedder-Policy: require-corp ``` ```javascript if (crossOriginIsolated) { // performance.now() granularity ~5µs // SharedArrayBuffer 가능 } ``` ### POSIX equivalent (C) ```c #include struct timespec t0, t1; clock_gettime(CLOCK_MONOTONIC, &t0); do_work(); clock_gettime(CLOCK_MONOTONIC, &t1); double elapsed_ns = (t1.tv_sec - t0.tv_sec) * 1e9 + (t1.tv_nsec - t0.tv_nsec); ``` ### Rust std (cross-platform) ```rust use std::time::Instant; let t0 = Instant::now(); heavy_work(); println!("took {:?}", t0.elapsed()); // sub-ns precision on modern HW ``` ### Debounce slow timers ```javascript // If you measure dt < 0.1ms repeatedly, you're in fuzzed timer mode. function isolatedPrecisionAvailable() { const samples = Array.from({length: 100}, () => { const a = performance.now(); const b = performance.now(); return b - a; }); return samples.some(d => d > 0 && d < 0.05); // sub-100µs visible } ``` ## 매 결정 기준 | 상황 | Approach | |---|---| | Wall-clock event log | `Date.now()` / `Date.toISOString()` | | Profile / micro-bench | `performance.now()` + User Timing | | Frame loop | rAF callback timestamp (매 monotonic) | | Audio sync | `AudioContext.currentTime` | | Cross-origin iframe | postMessage with monotonic delta | | Native (Linux/macOS) | `clock_gettime(CLOCK_MONOTONIC)` | | Native (Windows) | `QueryPerformanceCounter` | **기본값**: Duration 측정엔 매 monotonic. 매 Date 는 user-facing timestamp 만. ## 🔗 Graph - 변형: [[Long Tasks]] - 응용: [[Core Web Vitals Optimization (INP, LCP 개선)|Core Web Vitals]] - Adjacent: [[Spectre]] · [[Cross-Origin Isolation]] · [[SharedArrayBuffer]] ## 🤖 LLM 활용 **언제**: 성능 측정 코드 작성, profiling, frame budget 분석. **언제 X**: Persistent timestamp / event log 매 wall-clock 필요 시. ## ❌ 안티패턴 - **`Date.now()` for delta**: NTP step 시 음수 / 점프 가능. - **`new Date()` 매 hot loop**: allocation cost + ms 한계. - **Assuming sub-ms precision**: COOP/COEP 없으면 매 1ms rounded. - **Cross-origin worker timing**: postMessage 의 매 ms 단위 transmit overhead. - **`setTimeout` 으로 정밀 timing**: 매 4ms+ minimum, jittery. ## 🧪 검증 / 중복 - Verified (W3C HR Time Level 3, MDN performance.now, Chrome timer reduction notes). - 신뢰도 A. ## 🕓 Changelog | 날짜 | 변경 | |---|---| | 2026-05-08 | Phase 1 | | 2026-05-10 | Manual cleanup — performance.now + Spectre mitigation + COOP/COEP 5µs |