Intermediate · 9 lessons
Performance
Website performance directly impacts user experience, SEO rankings, and conversion rates. Google Core Web Vitals (LCP, FID, CLS) measure loading speed, interactivity, and visual stability — slow sites lose visitors and revenue.
Key Concepts
Key Takeaways
- ✓ Target LCP under 2.5s, FID under 100ms, CLS under 0.1.
- ✓ Images are usually the biggest payload — compress and use WebP/AVIF.
- ✓ Reduce HTTP requests by combining CSS/JS and using sprites.
- ✓ Test with Google PageSpeed Insights, GTmetrix, and WebPageTest.
Lessons in This Topic
Core Web Vitals Explained
Google's performance metrics that affect SEO.
LCP (Largest Contentful Paint): time until main content visible — target < 2.5s. INP (Interaction to Next Paint): responsiveness to clicks — target < 200ms. CLS (Cumulative Layout Shift): visual stability — target < 0.1. Poor scores hurt Google rankings since 2021.
Image & Asset Optimization
Reduce payload without losing quality.
Convert images to WebP (30% smaller than JPEG). Serve responsive sizes with srcset. Lazy load below-fold images. Use SVG for icons/logos. Compress with TinyPNG or Squoosh. Enable Brotli/Gzip compression on server for text assets.
Caching Strategies for Speed
Browser, page, object, and CDN cache layers.
Browser cache: Cache-Control headers tell browsers to reuse assets. Page cache: store rendered HTML (Varnish, LiteSpeed). Object cache: Redis/Memcached for database query results. CDN cache: edge servers worldwide. Each layer reduces origin server load.
JavaScript & CSS Optimization
Reduce render-blocking resources.
Minify and combine CSS/JS files. Defer non-critical JavaScript. Inline critical CSS for above-fold content. Remove unused CSS with PurgeCSS. Use async for analytics scripts. Avoid render-blocking fonts — use font-display: swap.
Database & Server Performance
Optimize backend for faster responses.
Add indexes to slow query columns. Enable query caching. Use connection pooling. Upgrade PHP version (8.x is 2x faster than 7.x). Enable OPcache. Move MySQL to dedicated server for high-traffic sites. Profile with Query Monitor plugin.