DEV Community

Cover image for Patterns.Dev Rendering Notes (Deleted Twitter Posts)
bronifty
bronifty

Posted on

Patterns.Dev Rendering Notes (Deleted Twitter Posts)

I do expect someone to correct me because I’m on a limb & veering into meta framework territory but feeling cute so will say anyway. Full SSR is hydrated once at the root of the DOM tree once all html is written & global closure of closures is constructed…
5:29 AM · Oct 20, 2022
·Twitter for iPhone
View Tweet analytics

boo 👻 nifty

·
1h
Replying to

Selective hydration can hydrate the DOM (attach React js handlers) before data is sent because html elements are wrapped in Suspense (a lazy load boundary synched with the server).
boo 👻 nifty

·
1h
What is server “sent” vs server “streamed”? It is the difference between serializing the DOM (stringnifying it as a convenient method of marshaling it over the wire by hyper-“text”-transfer-protocol) and piping it in chunks one at a time or several that is also fine
boo 👻 nifty

·
1h
What is this chunks? It is an automated task of node to slice a file into equal sized pieces, which are kept in order (like a linked list), and introduced into memory such that the server process may operate on them (eg pipe them to the browser). In the end, it is just an array.
boo 👻 nifty

·
1h
Stream is just array processing that node handles automatically with respect to memory contract management. Or memory management. You might say there is a contract as well.
boo 👻 nifty

·
45m
I'm going to refer to Addy & Lydia's 'Selective Hydration' as 'hydrating the skeleton' because handlers are attached to DOM sans data & fetcher could be isomorphic (same code on client & server produces same result; eg same call to db for data retrieval)
patterns.dev
Selective Hydration
How to use combine streaming server-side rendering with a new approach to hydration, selective hydration
boo 👻 nifty

·
14m
Finally, and I do expect pushback on this one, Islands Architecture is server rendered with JS sprinkles, meaning, like JQuery, it has multiple entry points without a single unified state lifecycle management paradigm...
boo 👻 nifty

·
14m
For instance, triggering a webhook would not send a message to the root of the app and cause it to rerender the component (to which the hook was attached as a handler during 'hydration') branch. The units of interactivity are as of yet (and for all time) unawares of one another

Top comments (0)