Web Development
Advanced
Web Performance Optimization Masterclass
Optimize Core Web Vitals (LCP, INP, CLS) and minimize bundle sizes for sub-second page loads.
Course Overview
Analyze performance traces, eliminate layout shifts, optimize critical rendering paths, and configure CDN caching strategies for production web apps.
What You Will Learn
Measure and optimize Core Web Vitals: LCP, INP, and CLS
Analyze Chrome DevTools Performance traces, Flamecharts, and Network waterfalls
Implement code splitting, tree shaking, and lazy loading strategies
Optimize font loading, responsive images (AVIF/WebP), and SVG assets
Configure HTTP/3, CDN caching headers, and service worker caching layers
Tools & Technologies Used
Chrome DevTools
Lighthouse
WebPageTest
Webpack/Vite
JavaScript
Structured Curriculum
2 Modules · 4 Lessons · 180 Minutes Total
Module 1
Module 1: Core Web Vitals & Performance Auditing
2 lessons
Module 1: Core Web Vitals & Performance Auditing
Audit rendering bottlenecks and measure user-centric performance.
-
Deconstructing LCP, INP, and CLS Metrics
Identify main-thread blocking scripts, layout shifts, and slow resource loads.
-
Chrome DevTools Performance Profiling
Record CPU profiles, inspect long tasks, and isolate Javascript memory leaks.
Module 2
Module 2: Bundle Optimization & Asset Delivery
2 lessons
Module 2: Bundle Optimization & Asset Delivery
Minimize JavaScript payloads and optimize critical rendering paths.
-
Tree Shaking, Dynamic Imports & Code Splitting
Configure bundler dynamic imports to load heavy modules only when needed.
-
Asset Compression & CDN Caching Strategies
Set up HTTP caching headers, Brotli compression, and prefetching directives.
Practical Project & Capstone Outcome
🚀 Capstone Project
Slow Dashboard Speed Transformation Audit
Take a bloated, 5-second loading legacy web application and optimize its assets, bundle sizes, and rendering loop to achieve a sub-1s LCP and 95+ Lighthouse score.
Prerequisites
- Frontend development experience (HTML, CSS, JS)
- Basic DevTools usage
Intended Audience
- Senior Frontend Engineers responsible for web page performance and conversion
- Full Stack Developers optimizing slow web applications
Instructor Information
L
Liam O'Connor
Course Author & Industry Expert
Liam O'Connor is a Web Performance Engineer who has optimized top-100 high-traffic media sites for lightning-fast delivery.
Frequently Asked Questions
Will this course cover the new INP (Interaction to Next Paint) metric?
Yes! INP optimization strategies and main-thread task splitting are core topics.