Batching is when React groups multiple state updates into a single re-render for a better performance
14
Client Side Rendering (CSR)
15
Server Side Rendering (SSR)
16
React 18 - Suspense in SSR
17
LYDIA HALLIE Advanced Rendering Patterns
18
It depends
19
React 18 - Server Components
20
Use Technologies as needed
21
Limit component size
22
Cache is your friend
23
Image Lazy Loading
24
Inline critical ; defer non-critical
25
Remove unused resources
26
React Profilers
27
Performance Optimisation is an ongoing process
28
Measure! Optimize!! Measure!!!
29
Questions
Description:
Learn to design high-performance React applications in this conference talk from JSWORLD Conference 2022. Explore why web performance matters, understand Core Web Vitals, and make informed use case decisions. Dive into topics such as rendering optimization, bundling and splitting, JavaScript budget management, and data mutation avoidance. Discover the benefits of immutability, reconciliation, and virtualization in React. Examine React 18 features like Automatic Batching and Suspense in SSR. Compare client-side and server-side rendering approaches, and learn about advanced rendering patterns. Gain insights on limiting component size, leveraging caching, implementing image lazy loading, and optimizing resource usage. Master the use of React Profilers and understand why performance optimization is an ongoing process that requires continuous measurement and improvement.