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
Showing Class Central Sort
-
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.