// 1. // Navigation Timing // new PerformanceObserver((entryList) => { for (const entry of entryList.getEntries()) { console.log('NavigationTiming:', entry); } }).observe({type: 'navigation', buffered: true}); // 2. // Resource Timing // new PerformanceObserver((entryList) => { for (const entry of entryList.getEntries()) { console.log('Page resource:', entry); } }).observe({type: 'resource', buffered: true}); // 3. // Paint Timing // new PerformanceObserver((entryList) => { for (const entry of entryList.getEntries()) { console.log('Paint timing:', entry); } }).observe({type: 'paint', buffered: true}); // 4. // Layout Shift // new PerformanceObserver((entryList) => { for (const entry of entryList.getEntries()) { console.log('Layout shift:', entry); } }).observe({type: 'layout-shift', buffered: true}); // 5. // Largest Contentful Paint // new PerformanceObserver((entryList) => { for (const entry of entryList.getEntries()) { console.log('LCP candidate:', entry.startTime, entry); } }).observe({type: 'largest-contentful-paint', buffered: true}); // 6. // Visibility State // new PerformanceObserver((entryList) => { for (const entry of entryList.getEntries()) { console.log('Visibility state:', entry); } }).observe({type: 'visibility-state', buffered: true});