Page Speed Checklist
Comprehensive checklist for optimizing your website's page speed. Track your progress and improve Core Web Vitals.
0 of 30 optimizations completed (0%)
Compress images
Use tools like TinyPNG, ImageOptim, or Squoosh to reduce image file sizes without losing quality.
Use modern formats (WebP, AVIF)
Convert images to WebP or AVIF for better compression. Use <picture> for fallbacks.
Implement lazy loading
Add loading="lazy" to images below the fold to defer loading until needed.
Specify image dimensions
Add width and height attributes to prevent layout shifts (CLS).
Use responsive images
Implement srcset and sizes for different viewport widths.
Minify CSS files
Remove whitespace, comments, and unnecessary characters from CSS.
Remove unused CSS
Use PurgeCSS or similar tools to eliminate CSS not used on your pages.
Inline critical CSS
Inline above-the-fold CSS to eliminate render-blocking requests.
Defer non-critical CSS
Load non-essential stylesheets asynchronously with media="print" trick.
Minify JavaScript
Compress JS files to reduce file size and transfer time.
Defer non-critical JS
Add defer or async attributes to non-essential scripts.
Remove unused JavaScript
Tree-shake and remove code that's never executed.
Code split / lazy load
Split bundles and load JavaScript only when needed.
Move scripts to bottom
Place non-critical scripts before </body> to not block rendering.
Enable GZIP/Brotli compression
Compress text-based resources on the server for faster transfer.
Set up browser caching
Configure Cache-Control headers for static assets (1 year for versioned files).
Use a CDN
Serve static assets from edge locations closer to users.
Enable HTTP/2 or HTTP/3
Use modern protocols for multiplexed connections and faster loading.
Reduce server response time
Optimize database queries, use caching, and consider faster hosting.
Use font-display: swap
Show fallback text while custom fonts load to improve FCP.
Preload critical fonts
Add <link rel="preload"> for fonts needed above the fold.
Subset fonts
Only include characters you actually use to reduce font file size.
Limit font variants
Use fewer weights and styles. Each variant adds load time.
Improve LCP (Largest Contentful Paint)
Optimize the largest element in the viewport - usually hero image or heading.
Reduce FID/INP (Input Delay)
Minimize main thread work and break up long tasks.
Fix CLS (Layout Shifts)
Reserve space for dynamic content, ads, and images.
Preconnect to required origins
Add <link rel="preconnect"> for third-party domains.
Audit third-party scripts
Identify and remove unnecessary third-party scripts.
Load third-party async
Ensure analytics, ads, and widgets don't block rendering.
Self-host when possible
Host frequently used third-party resources on your own CDN.
Impact:
Effort:
Why Page Speed Matters for SEO
Page speed is a confirmed Google ranking factor and directly impacts user experience. Slow-loading pages have higher bounce rates, lower conversions, and rank lower in search results.
Core Web Vitals Explained
- LCP (Largest Contentful Paint): Measures loading performance. Should occur within 2.5 seconds.
- INP (Interaction to Next Paint): Measures interactivity. Should be less than 200 milliseconds.
- CLS (Cumulative Layout Shift): Measures visual stability. Should be less than 0.1.
Quick Wins for Page Speed
- Image optimization: Often provides the biggest performance gains.
- Enable compression: GZIP/Brotli can reduce file sizes by 70%+.
- Browser caching: Return visitors load pages much faster.
- Defer JavaScript: Don't block rendering with non-critical scripts.
Testing Tools
- Google PageSpeed Insights: Comprehensive analysis with Core Web Vitals data.
- WebPageTest: Detailed waterfall charts and filmstrip view.
- GTmetrix: Combined Google and Lighthouse analysis.
- Chrome DevTools: Network tab, Lighthouse, and Performance profiler.
Need Help Optimizing Your Site?
Our team can audit your website's performance and implement optimizations that improve user experience and rankings.
Book Your Strategy Call