4 ms·
The big elephant in the room most of these frameworks are missing is partial hydration. Instead of hydrating the whole page, only the interactive parts are hydr
by pier25 6y ago
The big elephant in the room most of these frameworks are missing is partial hydration. Instead of hydrating the whole page, only the interactive parts are hydrated, sending the absolutely minimal JS needed to the client.
AFAIK only Marko has this feature today. Since it's developed and used at Ebay they focused on the best SSR+hydration experience from the start.
Imba v2 will also have patial hydration (confirmed by the devs here on HN).
Other than those two, it seems nobody is really taking partial/progressive/lazy hydration seriously. IMO SSR+partial hydration is really the next frontier in web development.
It's possible to do it yourself (I did it recently with a Svelte project) but it results in complicated setups. We need a solution that does it transparently, extracting the needed components and data automatically.
- ampdepolymerase 6y agoIt is coming soon. https://github.com/vercel/next.js/issues/10344 https://github.com/vercel/next.js/issues/10344
- hirako2000 6y agoI think it's coming not soon based on the last comment of this issue.
- pier25 6y agoIt's not. That issue is closed and the last comment says: > Overall it’s currently not possible to do this besides following what’s described in the article. Definitely something we plan on tackling eventually!
- sophiebits 6y agoThe React team is working on some experiments that’s not quite what you’re describing but achieves the goal of sending way less code to the client. I can’t wait until tools like that are more standard.
- pier25 6y agoThere is light at the end of the SPA tunnel :)
- tshaddox 6y agoThe React team is or was reportedly working on "progressive hydration" which sounds like what you're talking about. This tweet from React core team member Dan Abramov in December 2018: https://twitter.com/dan_abramov/status/1079352276433715200 https://twitter.com/dan_abramov/status/1079352276433715200
- pier25 6y agoThey've been talking about it for years alongside with SSR streaming. Nothing concrete so far.
- mulholio 6y agoI get the sense the React team don't really care about SSR as it's not a massive use case for FB.
- tshaddox 6y agoI thought it was a massive use case for Facebook. I recall seeing Facebook engineering tech talks about how they write their JavaScript with different types of import statements to optimize what gets rendered in SSR versus on the client. I think this is a similar video: https://www.youtube.com/watch?v=KT3XKDBZW7M https://www.youtube.com/watch?v=KT3XKDBZW7M
- sophiebits 6y agoThe React team has been focusing much more on SSR lately. I think it's likely we'll see big things in 2021.
- mulholio 6y agoGood to hear! If that's the case then I'm excited.
- dnissley 6y agoIs this not SSR streaming? https://reactjs.org/docs/react-dom-server.html#rendertonodestream https://reactjs.org/docs/react-dom-server.html#rendertonodes...
- tumblen 6y agoSince you mentioned Svelte, you may want to take a look into Elder.js, if you haven't: https://github.com/Elderjs/elderjs https://github.com/Elderjs/elderjs
- fold_left 6y agohttps://github.com/LukasBombach/next-super-performance https://github.com/LukasBombach/next-super-performance adds partial hydration to next. I was tempted by this some time ago, but ended up leaving it due to concern about straying too far off-piste from next itself.
- KaoruAoiShiho 6y agoIs Marko the ONLY framework with this feature? Surely there's some more.
- pier25 6y agoI've been looking at this for months and AFAIK it's the only one that has it OOTB. If you find others, please let me know. It can be implemented with React and others (I've done it with Svelte) but it's complicated. See this example on how to do it with Preact and Next: https://medium.com/@luke_schmuke/how-we-achieved-the-best-web-performance-with-partial-hydration-20fab9c808d5 https://medium.com/@luke_schmuke/how-we-achieved-the-best-we...
- kevinak 6y agoElder.js (Svelte framework) has partial hydration OOTB: https://github.com/Elderjs/elderjs https://github.com/Elderjs/elderjs
- earthboundkid 6y agoAlpine.js has partial hydration. ;-)
- pier25 6y agoIt works on any string of HTML but it doesn't have SSR so I don't think it counts as hydration. Also, the unsafe-eval CSP is way too risky.
- swyx 6y ago> only Marko has this feature not true, Elderjs from the Svelte ecosystem does exactly this
- ryansolid 6y agoI remember thinking when I first saw Marko it's kinda crazy how unknown Marko is given how well they've been doing streaming SSR and Partial Hydration for years. At production scale at eBay.