React, Rendering, Performance

on YouTube ↗47m

" summary

Built one app three ways and measured real numbers: CSR: ~4s to first visible, +600ms sidebar, +400ms messages, SSR: server HTML shows immediately but creates ~2.5s non‑interactive gap, convert data to server halves dynamic item times but delays server work, and RSC: static pages shrink (46KB → a few bytes) yet the interactive inbox shows no change. Streaming + Suspense yields chunked delivery and faster dynamic paint, but complexity and component ambiguity increase greatly.

AI-written summary · about

" chapters (34)

1. 0:00Introduction
2. 1:48React rendering vs performance
3. 3:32React server components
4. 5:38Client-side rendering baseline
5. 8:32Client-side rendering metrics
6. 11:01Why I love SPAs
7. 12:46Server-side rendering intro
8. 15:59SSR performance shifts
9. 17:25Interactivity gap in SSR
10. 18:08Move data fetching to server
11. 19:10SSR performance with server data
12. 20:33Manual SSR impractical
13. 21:14SSR framework differences
14. 22:58JS bundle size vs SSR
15. 23:20JS problem in React
16. 24:25Server components reduce JS
17. 26:09Convert app to server components
18. 27:14Server component bundle limits
19. 28:15Server components and data
20. 30:00Streaming with server components
21. 31:44Server components complexity
22. 32:26Suspense boundaries role
23. 33:10Streaming performance impact
24. 34:37Rendering performance models
25. 36:24Server components benefits
26. 37:29Debug slow server apps
27. 38:13When server components help
28. 38:56Server components verdict
29. 39:39Q&A
30. 40:22SSR caching strategies
31. 41:25Server vs client ambiguity
32. 42:29Isomorphic code ambiguity
33. 43:52Team size and React choices
34. 45:16React architecture decisions

" related talks

• 08mLightning fast SSR React apps with top perceived performance and no (client side) JavaScriptHåkon Gullord Krogh · React Amsterdam 2019
• 30mHow Streaming Can Supercharge ReactSasha Aickin · ReactEurope 2017
• 55m50 Shades of React Rendering with Next jsBen Ilegbodu · Connect.Tech 2024
• 34mReact The Good PartsTejas Kumar · React Alicante 2023
• 31mPerformance wins with React 18Aashima Ahuja · Armada JS 2023
• 40mReact Rendering Strategies Panel DiscussionReact Nexus 2023
• 44mServer Side Rendering from the trenchesWilliam Durand · jsDay 2018
• 31mReact Server Components Elevating Speed, Interactivity, and User ExperienceAurora Walberg Scharff · React Paris 2025