Disclaimer: I am ridiculously excited about Astro and working on my first major contribution (a SolidJS renderer).
> Astro embraces (and even claims to have “perfected”) the Islands architecture.
I may have missed this claim but there’s still some way to go here! I’ve been regularly chatting with one of Astro’s core devs—who also built Microsite[1], which I currently use for my own site—about a variety of partial hydration techniques that could improve on the current approach.
Notably:
- Currently Astro mounts components at hydration points in a vacuum, meaning you can’t share context across static boundaries the way you would do with a fully hydrated tree. There are opportunities here to use APIs like Portal and Suspense (where provided by the component library) to remove that limitation. The Portal approach is already in use by The Guardian, the Suspense approach is the foundation of React Server Components.
- Astro currently mounts to a parent astro-fragment custom element wrapper which breaks some sibling selector techniques commonly used for progressive enhancement. There are a couple ways to address this that I’ve found, including DOM Range and a proposed PersistentFragment allowing references to live ranges of DOM children as a Node-like parent without requiring it to be an actual parent Element.
1: https://github.com/natemoo-re/microsite
