What is the browser performance API and how do you measure performance?

Answer

The Performance API provides programmatic access to browser timing data. Key interfaces: performance.now(): high-resolution timestamp in milliseconds — more precise than Date.now(). Use for measuring code execution time: const start = performance.now(); doWork(); console.log(performance.now() - start). performance.mark() and performance.measure(): user timing API for marking specific points and measuring between them. Visible in DevTools. PerformanceObserver: observe performance entries as they occur: const observer = new PerformanceObserver((list) => { for (const entry of list.getEntries()) { console.log(entry.name, entry.startTime, entry.duration) } }); observer.observe({ entryTypes: ["largest-contentful-paint", "layout-shift", "longtask"] });. web-vitals library (Google): easiest way to collect Core Web Vitals: import { onLCP, onINP, onCLS, onFCP, onTTFB } from "web-vitals";. Long Task API: entryTypes: ["longtask"] — any main-thread task >50ms. Navigation Timing API: performance.getEntriesByType("navigation")[0] — complete page load timing breakdown.