Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

freeCodeCamp

React Performance Optimization Patterns Course

via freeCodeCamp

Overview

Coursera Flash Sale
40% Off Coursera Plus for 3 Months!
Grab it
Master React performance optimization through this comprehensive hands-on course that teaches battle-tested techniques used by senior engineers in production environments. Learn how React actually re-renders, identify why applications slow down, and discover which performance patterns truly matter beyond theoretical concepts. Explore fundamental optimization techniques including memoization with memo(), useCallback(), and useMemo(), along with derived state management, debouncing, and throttling strategies. Dive into advanced patterns covering the React Compiler, lazy loading with Suspense, component isolation, context optimizations, virtualization, concurrency with useTransition(), deferred values, and proper list key management. Gain practical experience through real-world examples and hands-on exercises that demonstrate when to optimize, what to optimize, and how to implement optimizations correctly in production React applications.

Syllabus

- Performance Patterns
- What’s in Part 1?
- Re-Rendering in React
- Memoization
- The memo
- The useCallback
- the useMemo
- The Derived State
- Debouncing
- Throttling
- Tasks from Part 1
- Advanced Patterns
- What’s in Part 2?
- React Compiler
- Lazy Loading & Suspense
- Component Isolation
- Context Optimizations
- Virtualization
- Concurrency and useTransition
- Deferred Value
- List and Keys
- Tools
- Tasks from Part 2
- One Word of Wisdom

Taught by

freeCodeCamp.org

Reviews

5.0 rating, based on 1 Class Central review

Start your review of React Performance Optimization Patterns Course

  • This course on React Performance Optimization Patterns provides battle-tested techniques for building fast React applications. The video is divided into two parts, covering various strategies to prevent unnecessary re-renders, optimize component behavior, and enhance overall application speed. Some important concepts were covered as Memoization (space-time tradeoff, a technique used in data-intensive application & also recursion algos), Derived State, Debounce, Virtualization, context optimizers. ps: using SSG (Next.js) could improve the the performance to various degree.

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.