Designing High Performance React Applications

Designing High Performance React Applications

JSWORLD Conference via YouTube Direct link

Intro

1 of 29

1 of 29

Intro

Class Central Classrooms beta

YouTube playlists curated by Class Central.

Classroom Contents

Designing High Performance React Applications

Automatically move to the next video in the Classroom when playback concludes

  1. 1 Intro
  2. 2 why performance matters?
  3. 3 Core Web Vitals
  4. 4 Sooner Time To Interactivity Lesser Layout Shifts
  5. 5 Bundling & Splitting
  6. 6 Budget JavaScript
  7. 7 Analyse JavaScript bundle size & Optimise
  8. 8 Avoid Data mutation
  9. 9 Immutability
  10. 10 Reconciliation
  11. 11 Virtualization
  12. 12 React 18 - Automatic Batching
  13. 13 Batching is when React groups multiple state updates into a single re-render for a better performance
  14. 14 Client Side Rendering (CSR)
  15. 15 Server Side Rendering (SSR)
  16. 16 React 18 - Suspense in SSR
  17. 17 LYDIA HALLIE Advanced Rendering Patterns
  18. 18 It depends
  19. 19 React 18 - Server Components
  20. 20 Use Technologies as needed
  21. 21 Limit component size
  22. 22 Cache is your friend
  23. 23 Image Lazy Loading
  24. 24 Inline critical ; defer non-critical
  25. 25 Remove unused resources
  26. 26 React Profilers
  27. 27 Performance Optimisation is an ongoing process
  28. 28 Measure! Optimize!! Measure!!!
  29. 29 Questions

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.