Master new skills with our 21-day learning paths, broken into easy 5-minute daily lessons.

Start your journey for free.

web Advanced 21 lessons

Web Performance (Core Vitals)

Master the art of web speed. Optimize Core Web Vitals including LCP and CLS using Chrome DevTools and Lighthouse profiling strategies.

Deep dive into the browser's rendering pipeline and network waterfalls. Learn how to diagnose bottlenecks, optimize asset delivery, minimize layout shifts, and ensure silky smooth interactions to improve user experience. This course covers everything from image compression algorithms to code-splitting strategies, ensuring your applications rank higher on Google. You will become proficient in reading complex flame charts and understanding exactly how the browser parses and paints code.

✅ 100% Free & Lifetime Access
⏱️ 5-Minute Lessons (Bite-sized learning)
🚀 21-Lesson Path (Independent modules)
📱 Mobile Friendly (Learn anywhere)
Perf Eng
Start Learning
Secure Enrollment via SSL

Complete Course Syllabus

  • 1
    Measuring Vitals
    Comprehensive breakdown of LCP, FID, CLS, and new INP metrics.
  • 2
    DevTools Profiling
    Identify main-thread blocking tasks and long JavaScript execution times.
  • 3
    Image Optimization
    Use modern formats (AVIF), responsive sizing, and lazy loading attributes.
  • 4
    Code Splitting
    Reduce initial bundle sizes using dynamic imports and webpack config.
  • 5
    Network Optimization
    Leverage CDNs, caching policies, and compression algorithms for assets.

Estimated completion time: 21 lessons • Self-paced learning • Lifetime access

Career Outlook

Estimated Salary
$110k - $150k

Career Paths

Web Performance Engineer $120k-$160k
Senior Frontend Dev $110k-$150k
Technical SEO Lead $90k-$130k

What You Will Learn

Analyze the Critical Rendering Path to unblock painting and speed
Eliminate Cumulative Layout Shifts (CLS) for visual stability and retention
Optimize Resource Loading with preconnect, preload, and fetch priority hints
Interpret complex Lighthouse Reports to prioritize high-impact code fixes
Implement Lazy Loading and code-splitting architectures to reduce payload

Skills You Will Gain

Chrome DevTools Lighthouse Core Web Vitals Resource Hints Rendering Optimization

Who Is This For

Senior Frontend Devs
SEO Specialists
QA Engineers

Prerequisites

Functional Web Development
Browser Mechanics Basics

Web Performance (Core Vitals) FAQs

Does this help SEO?

Yes, Google explicitly uses speed as ranking.

Is it for React?

The principles apply to all web frameworks.

Tools required?

Standard Browser DevTools and free online scanners.

Coding heavy?

Focuses on analysis, configuration, and tuning code.

Need more info?
All Reork courses are 100% free, self-paced, and fully accessible on mobile devices. No prior experience is required. Read our full Platform FAQ.

Tech Stack & Tools

Chrome DevTools
Lighthouse
WebPageTest
PageSpeed Insights
CDN Services

Recommended Next Steps

Remix Framework

web Intermediate

Return to web standards with Remix. Master the loader/action pattern, nested routing, and progressive enhancement to build robust full-stack React applications.

Deno Runtime

web Intermediate

Explore the secure-by-default successor to Node.js. Build modern applications with Deno, featuring native TypeScript support, modern standard library, and URL-based imports.

Micro-Frontends

web Advanced

Scale frontend development across massive teams. Master Module Federation, independent deployment strategies, and runtime composition for complex architectures.

Start Learning