Feature request: partial hydration

[kaicataldo]

Some context

I've been searching for a JSX-based, islands architecture static site generator for a while now (see my first attempt to solve this problem many years ago in 11ty). I had resigned myself to having to write what would effectively be a thin wrapper around vite that implemented this, but just hadn't found the time yet.

Feature request/discussion

I just came across the prerender option provided by this plugin and this gets me just about everything I want in a static site generator except for the partial hydration part. Is that something the team would be amenable to supporting in this plugin, or is that too opinionated?

There are a few existing projects that implement this ability to notate in different ways:

• My Eleventy plugin uses a higher order component to mark island root components at build time.
• Fresh will hydrate components in the islands/ directory.
• Astro uses a directive to achieve this.

Though I went a different route when I tried to solve this in my plugin a few years ago, I would personally advocate for an API similar to Astro's now. Fresh's API doesn't allow the user to denote different kinds of hydration strategies for a given island and the higher order component isn't as idiomatic as it once was. Either adding a directive to the root component or creating something like an InteractiveRoot wrapper component would allow the user to arbitrarily pick island root components as well as denote different hydration strategies for different instances of the same component, when appropriate.

If this is something the team is open to, I'd be more than happy to take a crack at implementing it. If it isn't and someone has a better idea of how one might go about this (maybe a separate plugin?), I'd love to hear it!

[rschristian]

It's certainly something we're interested in, myself especially, though I'm on the fence whether it'd make sense as part of the vite preset. I wrote the prerenderer (or rewrote it, I suppose), so only I'm to blame, but I am rather unhappy with the prerenderer dragging in more deps for functionality users might not need which I imagine this would need to do too. However, any islands plugin that's meant to work with our prerenderer will probably be tightly bound anyhow and providing it here would present it to more users (which is a good thing, it's a pattern we like a lot). So, I'm undecided.

There are a few Rollup/Vite islands plugins already, though (sorry reaper!) I haven't used them much: https://github.com/barelyhuman/preact-island-plugins & https://github.com/dumbjs/preland. Might be useful as prior art.

In the interest of perhaps saving you time, I'd suggest spec'ing it out here roughly with how you envision it working/piecing together, we'll weigh in & decide if that's something that we want to directly include or if it's something best left separate. Marvin works on Fresh so I imagine he'd have some ideas too.

[kaicataldo]

Appreciate the quick and thoughtful response. I'll take a look at those other plugins and see if I can find some time to dedicate to exploring in order to present something more concrete.

[rschristian]

If it's faster for you to write up a demo PR or similar (doesn't have to be fleshed out all the way) certainly go for it! I just want to ensure we're being respectful of your time if you're volunteering to take a shot, so absolutely whatever you think is quickest to get the idea out there.

This hasn't been something we've talked about yet beyond a few comments here and there so there's no particular vision we have in mind, very open to different approaches.