htm
htm copied to clipboard
How to use with server side rendering?
It would be nice if there was documentation on how to use this with server side rendering.
Such that:
- Server sends the prerendered compontent
- Client receives the prerendered component and makes it interactive for the user
For now, the best result I've found is this:
https://zeit.co/blog/seamless-serverless-markup-htm
@balupton based on this blogpost, I made a small example with data fetch & SSR: https://github.com/goldo/serverless-htm-now
I guess if you want to to make the client interactive, you would code just nearly as you would have done with React. Here's a good example: https://www.youtube.com/watch?v=Y5cGZqrSQTM
You could use esm to import es modules: https://github.com/kristoferjoseph/arc-ssr-esm/
One could probably pair htm, react, and pika for client and server side rendering on cloudflare workers right? With terraform for deployment? I think that would be a sweet combo. As zeit ends up costing me about $5/month anyway, due to need for many deployments a month.
It would be nice if there was documentation on how to use this with server side rendering.
Such that:
- Server sends the prerendered compontent
- Client receives the prerendered component and makes it interactive for the user
I am also looking for a good implementation or this, without any need for transpile in dev environment.
I have also done something similar to @goldo's approach, but I'm afraid it doesn't cut it when it comes to components.
Hooks can be a solution, but to me it seems like we have to give up a bit too much flexibility when ruling out components entirely.
I created a small demo to make it work-ish. Although I had to use some dependency injection of htm
and vhtml
to make it render seamless on server and client. I also had to rely on a Hooks-inly implementation. Not too keen on this opinionated implementation tho.
Take a look here if you are interested https://github.com/mfolkeseth/dvlp-test. Some feedback towards a better approach would be very much appreciated 👍
@balupton Check out this approach for server side render without heavy transpiler https://github.com/mfolkeseth/dvlp-test.
Or check out dvlp if you want to roll your own implementation.
I'm guessing as cloudflare-workers is web workers, they should have the dom apis available, so they should be able to run htm (via a bundler) without anything fancy right?