4 ms·

> *"always bet on Javascript" I've been keeping all the modern javascript frameworks at arms distance, because I've always preferred to bet on HTML, for the cl

> *"always bet on Javascript" I've been keeping all the modern javascript frameworks at arms distance, because I've always preferred to bet on HTML, for the client at least. That said, I've no issues with heavy reliance on JS on the developer machine, but I always prefer pages that can work without the reliance on JS. So, it seems opportune to ask: Is there a JS framework around that actually compiles to HTML and CSS rather than embedding the HTML in JS/DOM calls? In my rudimentary analysis of React/Vue and others (eg svelte), I can't find out how to have the end result without the framework sitting in there too. Perhaps I keep missing something in my understanding?

beardedman 7y ago
So this is what Svelte does, the app gets built at build time so you don't need the include any script in the browser for it to run. I remember RH talking about the React Hooks inspiration thing, so whether the API will go more in that direction (and eventually be a runtime thing), I'm not too sure.
- rahimnathwani 7y ago
  GP wants something that compiles down to HTML and CSS. Svelte compiles down to JS.
chrismorgan 7y ago
Some client-side libraries can also perform server-side rendering, giving them the label isomorphic. Most such are ones that use a VDOM, which makes it easy to do (though it becomes a bit harder again if you worry about rehydration, which is strictly optional but normally desirable, so that you can still add things like event handlers on the client side). Svelte is one that does it more efficiently, compiling to a different result: fiddle in its playground and look at what it compiles to depending on whether you ask for the dom target or the ssr (server-side rendering) target.
socceroos 7y ago
I think Web Components are an interesting mix where you are creating html tags using JS/HTML/CSS and they are natively interpreted by the browser.
rich_harris 7y ago
It can't 'compile' to HTML, because it doesn't know at compile time what data you're going to give the component. Instead, if you compile with `ssr: true`, the JavaScript it generates is a module that generates HTML through efficient string concatenation. It's very easy to bake out static files as part of a build step, or generate markup dynamically as part of a Node server. CSS is extracted at build time; typically your styles will be served as static .css files for maximum efficiency.

beardedman 7y ago

So this is what Svelte does, the app gets built at build time so you don't need the include any script in the browser for it to run. I remember RH talking about the React Hooks inspiration thing, so whether the API will go more in that direction (and eventually be a runtime thing), I'm not too sure.

rahimnathwani 7y ago
GP wants something that compiles down to HTML and CSS. Svelte compiles down to JS.

chrismorgan 7y ago

Some client-side libraries can also perform server-side rendering, giving them the label isomorphic. Most such are ones that use a VDOM, which makes it easy to do (though it becomes a bit harder again if you worry about rehydration, which is strictly optional but normally desirable, so that you can still add things like event handlers on the client side). Svelte is one that does it more efficiently, compiling to a different result: fiddle in its playground and look at what it compiles to depending on whether you ask for the dom target or the ssr (server-side rendering) target.

socceroos 7y ago

I think Web Components are an interesting mix where you are creating html tags using JS/HTML/CSS and they are natively interpreted by the browser.

rich_harris 7y ago

It can't 'compile' to HTML, because it doesn't know at compile time what data you're going to give the component. Instead, if you compile with `ssr: true`, the JavaScript it generates is a module that generates HTML through efficient string concatenation. It's very easy to bake out static files as part of a build step, or generate markup dynamically as part of a Node server. CSS is extracted at build time; typically your styles will be served as static .css files for maximum efficiency.