Web Performance
advancedTopic 13 of 14 in Frontend Development
What it is
Web performance is about making your site load fast and respond instantly. It covers how browsers render pages, what slows them down, and techniques to optimise images, scripts, and network requests.
Why frontend developers need it
Slow sites lose users. Google uses page speed as a ranking factor. Performance is not an afterthought — it directly affects user experience, conversion rates, and search visibility.
What to learn
Core Web Vitals: LCP, FID/INP, CLS
Browser rendering pipeline: parsing, layout, paint
Image optimisation: formats, lazy loading, responsive images
Code splitting and lazy-loading JavaScript
Caching strategies and CDNs
Lighthouse and Chrome DevTools Performance panel
Bundle analysis and tree-shaking
Practice project
Performance Audit
Take a project you have already built, run a Lighthouse audit, then fix every performance issue: optimise images, add lazy loading, split code bundles, and improve your Core Web Vitals scores.