58 items
Measuring CLS in the Loading Pipeline
Code QuizCore Web Vitals & Loading Pipeline
QuizMeasuring CLS with PerformanceObserver
Code QuizCore Web Vitals: LCP, CLS, INP
QuizObserving LCP with PerformanceObserver
Code QuizUnderstanding LCP and CLS
QuizTime to First Byte (TTFB)
Slides / VideoLCP Thresholds
Code Quizweb-vitals Library
Code QuizPerformanceObserver Setup
Code QuizNavigation Timing
Code QuizTotal Blocking Time
Code QuizMeasuring FCP
Code QuizComputing TTFB
Code QuizFID Calculation
Code QuizINP Thresholds
Code QuizCLS Thresholds
Code QuizRating Boundaries
Code Quizp75 Percentile
Code QuizLab vs Field Data
Code QuizLargest Contentful Paint (LCP)
Slides / VideoWhat Core Web Vitals Are
Slides / VideoTools for Measuring Web Vitals
Slides / VideoLab Data vs Field Data (RUM)
Slides / VideoCore Web Vitals: Three Categories
Slides / VideoGood vs Poor Metric Thresholds
Slides / VideoTime to Interactive (TTI)
Slides / VideoWhy the 75th Percentile
QuizCLS Good Threshold
QuizFID Replaced by INP
QuizLCP Rating Thresholds
QuizThe Three Core Web Vitals
QuizINP Good Threshold
QuizLab vs Field Data
QuizWhat LCP Measures
QuizWhat INP Measures
QuizTotal Blocking Time Basics
QuizSpeed Index Basics
QuizWhat CLS Measures
QuizWhy Metrics Are User-Centric
QuizTime to Interactive Basics
QuizFirst Contentful Paint (FCP)
FlashcardFirst Input Delay (FID)
FlashcardPercentiles (p75) in Measurement
FlashcardLab Data vs Field Data
FlashcardSpeed Index
FlashcardTime to First Byte (TTFB)
FlashcardCumulative Layout Shift (CLS)
FlashcardInteraction to Next Paint (INP)
FlashcardTime to Interactive (TTI)
FlashcardTotal Blocking Time (TBT)
FlashcardLargest Contentful Paint (LCP)
FlashcardCore Web Vitals Thresholds
FlashcardWhat Core Web Vitals Are
FlashcardFirst Contentful Paint (FCP)
Slides / VideoInteraction to Next Paint (INP)
Slides / VideoCumulative Layout Shift (CLS)
Slides / VideoFirst Input Delay (FID)
Slides / VideoObserving LCP with PerformanceObserver
Spot the bug in a PerformanceObserver setup meant to measure Largest Contentful Paint.
const observer = new PerformanceObserver((list) => {
for (const entry of list.getEntries()) {
console.log('LCP candidate:', entry.startTime);
}
});
observer.observe({ type: 'largestContentfulPaint', buffered: true });This code should log Largest Contentful Paint entries but never fires. What is the bug?