Web Performance Optimization

Measure and improve page speed with Core Web Vitals, DevTools and Lighthouse. Apply proven fixes for images, JavaScript, caching and delivery.

Start course →

What you'll learn

  • Explain Core Web Vitals (LCP, INP, CLS) and set targets for each.
  • Optimize images, fonts, CSS and JavaScript to cut load time.
  • Apply caching, CDN, HTTP/2–3 and resource hints to speed up delivery.
  • Diagnose bottlenecks with DevTools, Lighthouse, WebPageTest and RUM.
  • Set performance budgets and prevent regressions in CI.

Syllabus

Module 1: Getting started

  1. Why performance matters

Module 2: Foundation

  1. Core Web Vitals
  2. Performance metrics fundamentals

Module 3: Core optimization

  1. Image optimization
  2. Asset compression and minification
  3. Caching strategies

Module 4: Data delivery

  1. HTTP/2 and HTTP/3
  2. CDN usage and optimization

Module 5: Design and architecture

  1. Code splitting and bundling
  2. Lazy loading and infinite scroll
  3. Critical rendering path

Module 6: Optimization techniques

  1. JavaScript optimization
  2. CSS optimization
  3. Font optimization
  4. Video optimization

Module 7: Measurement & quality

  1. Chrome DevTools and Performance API
  2. Lighthouse scoring and audits
  3. WebPageTest and real-world testing

Module 8: Tools and monitoring

  1. Resource hints and preloading
  2. Service Workers and offline support
  3. Performance monitoring and budgets

Module 9: Advanced optimization

  1. Advanced performance techniques
  2. Performance best practices and patterns

Module 10: Revision and mastery

  1. Common performance pitfalls and how to avoid them
  2. Interview questions and practical scenarios