A Complete Guide to Performance Optimization in React Applications.

Last updated: March 01, 2020

This is my first post on my new fake blog! How exciting!

Many React applications are slow! Others are pretty fast too. In nearly every case, those you might consider as fast could be faster. What makes the difference?

This course is designed to take you beyond simply building web applications with React. You would learn various ways to optimize your React applications for performance without compromising functionality. The methods we’d be applying will range from minor syntax changes to better development practices to architectural concerns and will be explored following a practical approach. If this doesn’t excite you, I’m not sure what will.

Course Structure Using a simple React application which is currently un-optimized, we will go through the performance tips / concepts outlined below. We will walk through them, showing exactly how they may be applied and the benefits when used in our sample application. We would do a before and after comparison of the application to highlight the performance gains along the way. Course Outline Section Title

Article Title

1 Introduction

2 Structure and Setup

A Look into React 3 Components

4 State & Props

5 Component Life-cycle

6 The Virtual DOM & Reconciliation

Measuring/Testing Performance 7 React Addons

8 Browser Profiling

9 Chrome Performance Tab

Working with Components 10 Stateless vs Stateful

11 shouldComponentUpdate

12 Pure Components

13 Memoization

14 React 16 Enhancements memo,suspense, lazy,hooks Handling State and Props 15 Mutating State

16 Immutable Data Structures

Tooling 17 Webpack & Code splitting

18 Compression with GZIP

19 Brunch

20 Browserify

21 Rollup

22 Virtualizing Lists react-virtualized Code Enhancements 23 Function Binding

24 ESLINT React

25 De-bouncing Input Handlers

A Lil more… 26 Production Build

27 Single File Builds

28 Finding Problematic Bundles webpack bundle analyzer

29 Tree shaking moment-locales-webpack-plugin

30 SSR

Summary 31 Story so far

32 Final Note