🚀PageSpeed Insights & Core Web Vitals

Hugo integrates directly with Google's PageSpeed Insights API v5 to deliver real Lighthouse performance data. This goes beyond the static HTML checks in the standard Performance category — it actually loads your page in a headless Chrome browser and measures real-world performance metrics.[1] This check adds 5% weight to your overall score.

Lighthouse Performance Score

The Lighthouse performance score (0–100) is a weighted combination of the five Core Web Vitals metrics.[2] This is the same score you'd get from Chrome DevTools or web.dev/measure.

Core Web Vitals

Core Web Vitals are Google's specific metrics for measuring real-world user experience. They've been part of Google's page experience ranking signal since June 2021.[3] Here's what each measures:

Largest Contentful Paint (LCP)

LCP measures how quickly the largest visible content element (image, video, or text block) loads.[4] It directly reflects perceived loading speed.

First Contentful Paint (FCP)

FCP measures when the browser first renders any content (text, image, SVG, canvas).[5] It indicates when the user first sees something happening.

Total Blocking Time (TBT)

TBT measures the total time the main thread was blocked by long tasks (>50ms) between FCP and Time to Interactive.[6] High TBT means the page feels unresponsive to user input.

Cumulative Layout Shift (CLS)

CLS measures visual stability — how much page content shifts during loading.[7] Unexpected layout shifts frustrate users, especially on mobile.

Speed Index

Speed Index measures how quickly content is visually populated during page load. A lower score means content appears faster.

Interaction to Next Paint (INP)

INP measures responsiveness — the time from when a user interacts (clicks, taps, or presses a key) to the next visual update on screen.[8] It replaced First Input Delay (FID) as an official Core Web Vital in March 2024, because INP covers the full interaction lifecycle, not just the first one.

Real-World Data (Chrome UX Report)

In addition to lab measurements, Hugo shows field data from the Chrome UX Report (CrUX) when available.[9] This is real performance data collected from Chrome users who visited the URL over the past 28 days — not a simulation.

For each metric, Hugo shows the p75 value (the 75th percentile — meaning 75% of real users experienced this value or better) and a distribution bar split into Fast, Moderate, and Slow segments.

Diagnostics

Hugo also surfaces several diagnostic metrics that help you understand where time is being spent, even if they don't directly affect your Lighthouse score.

• Time to Interactive (TTI) — Time until the page is fully interactive and responds to user input. Thresholds: ≤3.8s good, ≤7.3s needs work. Note: TTI was removed from Lighthouse scoring in v10 but remains a useful diagnostic.
• Main Thread Work — Total time the browser main thread spent parsing HTML, executing JavaScript, and rendering. Broken down by category (Script Evaluation, Style & Layout, Rendering, etc.).
• Resource Breakdown — Total page weight by resource type (scripts, images, stylesheets, fonts). Helps identify which asset categories dominate transfer size.
• Third-party Impact — External scripts (analytics, ads, chat widgets) that block the main thread. Identifies specific origins and their blocking contribution.

Optimization Opportunities

Beyond metrics, PageSpeed Insights identifies specific optimization opportunities with estimated savings. Hugo surfaces these as actionable recommendations. Click any opportunity row to see a detailed description.

• Render-blocking resources — CSS and JS that delay first paint
• Unused CSS/JavaScript — Code downloaded but never executed
• Modern image formats — Using WebP or AVIF instead of JPEG/PNG
• Offscreen images — Images not in the viewport that could be lazy-loaded
• Text compression — Enabling gzip or Brotli for text assets
• HTTP/2 — Modern protocol with multiplexing for faster parallel downloads
• DOM size — Excessively large DOM trees that slow rendering
• Server response time — Slow TTFB delays all other resources