Speed Index: How Quickly a Page Visually Fills In
Speed Index scores how fast the visible area of a page fills with content, rewarding fast visual progress over a slow reveal.
Speed Index is a score for how quickly visible content finishes painting.
What It Is
Speed Index measures how quickly the content visible in the viewport becomes fully painted.
It rewards pages that show useful content fast, even if the whole page takes longer.
How It Is Calculated
- It samples frames of the page as it loads.
- Faster visual progress toward a complete page scores better.
- Large above-the-fold shifts count against it.
Why It Matters
- It captures perceived speed, which is what visitors actually feel.
- It flags pages that paint slowly even when other metrics look fine.
- Lighthouse reports it as part of the performance score.
How to Improve
- Optimize the hero image and critical CSS.
- Avoid layout shifts above the fold.
- Render the main content before lazy-loaded extras.
- Minimize font loading delays.
Before: a page takes six seconds to paint its hero section.
After: critical content renders first and images are optimized.
The result: the page looks complete in under three seconds.
The lesson: perceived speed is real speed.
Quick Tip
Speed Index penalizes slow reveals, so make sure the most important content paints early.
Frequently Asked Questions
Speed Index, in Short
Visitors judge speed by what they see fill the screen.
Paint the important things first and the score follows.