Avoiding unnecessary work.
WHAT CAUSES SLOWNESS
Components re-rendering when nothing relevant changed Expensive computation on every render Very large lists Large bundles
WHAT TO DO FIRST
Measure, using the profiling tools.
WHY
Guessing where time goes is usually wrong, and premature optimisation adds complexity for nothing.
WHAT MEMOISATION DOES
Skips re-rendering or recomputation when inputs have not changed.
WHEN TO USE IT
When profiling shows a genuine cost.
WHY NOT EVERYWHERE
It has its own cost, and applied indiscriminately it makes code harder to read for no benefit.
WHAT COMMONLY DEFEATS IT
New objects or functions created during render and passed as props.
WHY
They are different values each time, so nothing is considered unchanged.
WHAT TO DO ABOUT LARGE BUNDLES
Split by route, and load components on demand.
WHAT TO DEFER
Anything not needed for the initial view.
WHAT TO CHECK
Bundle size, and time until interactive, on a modest device.
WHAT TO REMOVE
Dependencies added for one function.