search

i-like-robots / hyperons

🔥 The fastest JSX to string renderer on the server and in the browser.
https://www.npmjs.com/package/hyperons
MIT License
45 stars 4 forks source link

`Suspense` and `async` Component Support #50

Open shellscape opened 10 months ago

shellscape commented 10 months ago

Hey thanks for the package! Any chance of getting Suspense and async support? For reference, hono just added experimental support for that concept https://github.com/honojs/hono/blob/next/src/jsx/streaming.ts#L25

i-like-robots commented 10 months ago

Thanks for your question @shellscape.

I have considered implementing a streaming - async - renderer before because JSX is so slow compared to string based template libraries like Handlebars. However, I've not had a reason to invest effort into this.

Because this library doesn't handle state I think any <Suspense> implementation would be very basic - either always rendering the fallback or always waiting for its children to resolve. It's certainly possible to support this to avoid erroring if nothing else.

shellscape commented 6 months ago

@i-like-robots we're currently using a mishmashed jsx renderer, with a significant portion based on hyperons. we've integrated Suspense support here: https://github.com/shellscape/jsx-email/blob/afd9ca80fe1111e17796901f7bd6c0187c0a0de5/packages/jsx-email/src/render/jsx-to-string.ts#L93-L143

It works well with all of our testing and userland use. Hopefully that's helpful for hyperons.

i-like-robots commented 6 months ago

Thank you @shellscape that's very interesting. And I'm really pleased to hear the code has been useful for more people 👍

i-like-robots commented 6 months ago

I've added a very basic shim for the <Suspense> component in #51

Longer term, I think supporting async components could be really interesting - not many templating languages do this well but it feels like it could be a fairly natural fit for JSX.