YoVDO

React Redux Performance Techniques and Optimizations

Offered By: Dave Gray via YouTube

Tags

React Courses Web Development Courses Redux Courses

Course Description

Overview

Explore advanced React Redux performance techniques and optimizations in this comprehensive tutorial video. Dive into a practical blog project to understand component re-rendering, implement memoized selectors, utilize createEntityAdapter, and apply React.memo. Learn to identify and resolve optimization issues, create normalized state structures, and leverage entity adapter CRUD methods and generated selectors. Master the art of improving your React Redux application's performance through hands-on examples and in-depth explanations of key concepts and best practices.

Syllabus

Intro
Welcome
Prerequisite knowledge
Starter Code Note
UsersList component
selectByUserId selector
UserPage component
Adding user routes to App.js
Adding a catch all route
Add Users link in header
Testing the user components
Adding count state, reducer, and selector
Adding a counter to the header
Quick typo fix
Optimization issue 1
Identifying the cause of re-renders
Creating a memoized selector
Updating the UserPage component
Testing our changes
Optimization issue 2
Solving with React.memo
A full-featured solution
Normalization
Adding createEntityAdapter
Changes to initial state
Using entities as a lookup object
Applying entity adapter CRUD methods
Entity adapter generated selectors
Reviewing postsSlice changes
PostsList component changes
PostsExcerpt component changes
Testing the entity adapter changes


Taught by

Dave Gray

Related Courses

Introduction to ReactJS
Microsoft via edX
Front-End Web Development with React
The Hong Kong University of Science and Technology via Coursera
Multiplatform Mobile App Development with React Native
The Hong Kong University of Science and Technology via Coursera
Client-based Web Applications development: ReactJS & Angular
Universidad Politécnica de Madrid via Miríadax
React
Udacity