React Internals Deep Dive 30 - What is Progressive Hydration and how it works internally in React?
In this video I'm talking about Progressive Hydration and how it works blog post: https://jser.dev/react/2023/03/30/pro...
With previous two episodes on hydration and Suspense, Progressive Hydration is actually much simpler than I first thought.
on server, if Suspense is suspended, React sends down the fallback HTML first (marked as comment node $?) and later streams down the Suspense contents and scripts to trigger re-render.
on client
on the initial response, fallback HTML is kept un-touched during the hydration, but a retry callback is set on the comment node.
on following incoming responses, fallback HTML is replaced with the contents HTML and retry callback is triggered. For multiple Suspenses, React use unique ids to pair fallbacks and contents.
Hi I'm a JavaScript engineer who is not good at algorithms, If you are interested, maybe we can learn together.
support me: https://www.buymeacoffee.com/jser