HN Explorer

Ask HN: Any web frontend library that fallbacks to SSR if JavaScript is missing?

20 points by _448 ↗ HN
What web frontend frameworks/libraries are available that fallbacks to server-side rendering if JavaScript is unavailable on the client-side?

I can think of Unpoly, but are there any other options available?

15 comments

[ 9.1 ms ] story [ 42.6 ms ] thread
pcthrowaway
I'm pretty sure Svelte and Sveltekit can do this for navigation. Maybe Gatsby too.

But keep in mind a lot of the interactivity won't work the same.

Generally the page is pre-rendered on the server, and then links are hydrated to prevent page refreshes on navigation. If Javascript is off, the browser does a page refresh when the user clicks links, and the server pre-renders those.

In fact, I think a lot of frameworks can do this now: Qwik, Next, etc.

Leftium
SvelteKit encourages and provides tools for "progressive enhancement"[1]. This means your site will work even if JS is missing.

- There is a SvelteKit clone of Wordle that does not need JS[2] with (video introduction[3])

- I built this SvelteKit app to work without JS: https://multi-launch.leftium.com/

It takes a little effort to ensure your app will work without JS, but SvelteKit tries to make it as easy as possible:

- The first render of your page is done on the server[4]. This ensures the first render has access to JS even if the client doesn't. It's also supposed to decrease the time to first render.

- SvelteKit form actions are designed to work without JS, by default[5].

[1]: https://kit.svelte.dev/docs/form-actions#progressive-enhance...

[2]: https://kit-git-sverdle-svelte.vercel.app/sverdle

[3]: https://www.youtube.com/live/A8jkJTWacow?feature=share&t=290...

[4]: https://kit.svelte.dev/docs/seo#out-of-the-box-ssr

[5]: https://kit.svelte.dev/docs/form-actions

pcthrowaway
Yeah, I've done the no-JS capable thing for a vanilla Svelte app with an express backend on EC2. Required a bit of bushwhacking to get the svelte routing working on the server, but worked really well in the end.

I think Sveltekit makes this easier, but at the cost of being more complex to self-host (you might get tied to Vercel which employs Rich Harris and makes all the Sveltekit SSR stuff "just work" in ways that I'm concerned won't just work if you're not using vercel)

Leftium
The Vercel adapter may get some more attention and features first (like ISR[1]), but local development only requires NodeJS. So I think you can self-host SvelteKit anywhere that supports NodeJS. SvelteKit is designed to be serverless-first, but still supports traditional servers-based deploys.

And there are several non-Vercel adapters that should just work (Node, Cloudflare Pages, Cloudflare Workers, Netlify, static site generation)[2].

And even more unofficial adapters[3]!

[1]: https://kit.svelte.dev/docs/adapter-vercel#incremental-stati...

[2]: https://kit.svelte.dev/docs/adapters

[3]: https://sveltesociety.dev/components#adapters

v0idzer0
React? Pretty trivial to set this up in React. But why fallback when you can just do both. SSR always. Then let the js run if its enabled. This is what Next.js and countless other react frameworks do
seabysalt
Definitely next.js that's why it's also way better for SEO than react