5 ms·

> Glimmer compiles your templates into low-level code so it can run as fast as possible—without sacrificing ease of use. What's the benefit vs just writing you

> Glimmer compiles your templates into low-level code so it can run as fast as possible—without sacrificing ease of use. What's the benefit vs just writing your templates in JavaScript in the first place?

lowboy 10y ago
> ease of use
LocalPCGuy 10y ago
JavaScript takes time to parse and execute. My understanding is that the Glimmer solution reduces both parsing and execution time because it uses techniques that are highly optimized by the browser JavaScript engines, which makes it faster (sometimes significantly) than just using JavaScript templates. I also believe that's what is referred to when they use words like "low-level" and "close to the metal" in reference to what they are doing.
tomdale 10y ago
JSX vs. templates is a common debate, with popular JSX options like React and Preact and template-based options like Vue and Glimmer. The reality is that there are hard tradeoffs to both and anyone who tells you one is obviously superior to the other is probably trying to sell you something. For me personally, templates ever-so-slightly edge out tools like JSX. For one, I subscribe to the Rule of Least Power[0]. Having the full expressiveness of JavaScript is very nice, but it makes it harder for tools to statically analyze and optimize the rendering process. Ember has gone through three major rendering engine architectures now (string-based, DOM-based and now the Glimmer VM) and the simplicity of the templating language has made that portability much easier. [0]: https://www.w3.org/2001/tag/doc/leastPower.html https://www.w3.org/2001/tag/doc/leastPower.html More importantly though, there are a lot of people in the world who know HTML and CSS. The fact that Glimmer templates are "just HTML" makes them accessible to people like designers who may not understand all of the fancy destructuring or array mapping happening in your JSX. Lastly, and this is perhaps just a personal foible, but I have a really hard time mentally mapping more complicated JSX expressions into the final HTML output. It's fine when you're writing it, but reading it later, particularly to write CSS for it, is more challenging for me than Handlebars. I know some people would say that this is a code smell and that I should break that component up into smaller components, but I'd rather that decision be made by me than because I feel forced into it by the muddiness of my render() method.
- ng12 10y ago
  I absolutely hate any sort of HTML directives or non-trivial templating which in my mind violate the RoLP. You have a fundamentally simple technology and you're shoehorning complexity into it with the end result being there are multiple ways to implement everything. In my mind I'd rather have one tool to do everything -- Javascript. I don't think of JSX as HTML, I think of it more like Elm does -- a way to structure your UI in code which just happens to compile to HTML. As for mapping JSX to HTML I think React's biggest strength is it's composability. But it comes with a price: things start to smell very, very quickly unless you religiously separate concerns.
  - boubiyeah 10y ago
    Yeah... That's my experience as well. "Hummm, this string technology was meant for static webpages :( I think the solution is to create an arbitrary sub-language and add more string bits to it to make it dynamic" is more adapted when you quickly want to add a few dynamic behaviors to an existing static template here and there, but not so much when you build a complex app from the ground up. Not to mention these opaque strings suck when you are serious about using a typed language :)
- catshirt 10y ago
  "The fact that Glimmer templates are "just HTML" makes them accessible to people like designers who may not understand all of the fancy destructuring or array mapping happening in your JSX." isn't this like, at least a little backwards? JSX is HTML and JS. templating languages are HTML with some custom DSL. destructuring and especially mapping are pretty simple concepts. creating a new syntax to cater to people who couldn't learn one in the first place seems counterintuitive? is teaching someone a for loop really at all (let alone significantly) easier than teaching them to map an array? edit: "creating a new syntax to cater to people who couldn't learn one in the first place seems counterintuitive?" on second read this seems thoughtless. isn't that almost the whole point of a DSL? i think you and i have convinced myself to stop hating on templates.
  - boubiyeah 10y ago
doublerebel 10y ago
Specialized JS objects can conform to the Virtual DOM spec and therefore be most efficiently rendered by any Virtual-DOM renderer such as React, Maquette, Inferno, etc. It's easiest to use a template language or JS object builder that already conforms to the spec. I use Pug/Jade, which always compiled to JS for speed and also supports Virtual DOM and server-side rendering. Pug can be written, understood, and updated by users who have no knowledge of JS but still gives me the full power of JS when necessary.

lowboy 10y ago

> ease of use

LocalPCGuy 10y ago

JavaScript takes time to parse and execute. My understanding is that the Glimmer solution reduces both parsing and execution time because it uses techniques that are highly optimized by the browser JavaScript engines, which makes it faster (sometimes significantly) than just using JavaScript templates. I also believe that's what is referred to when they use words like "low-level" and "close to the metal" in reference to what they are doing.

tomdale 10y ago

JSX vs. templates is a common debate, with popular JSX options like React and Preact and template-based options like Vue and Glimmer. The reality is that there are hard tradeoffs to both and anyone who tells you one is obviously superior to the other is probably trying to sell you something. For me personally, templates ever-so-slightly edge out tools like JSX. For one, I subscribe to the Rule of Least Power[0]. Having the full expressiveness of JavaScript is very nice, but it makes it harder for tools to statically analyze and optimize the rendering process. Ember has gone through three major rendering engine architectures now (string-based, DOM-based and now the Glimmer VM) and the simplicity of the templating language has made that portability much easier. [0]: https://www.w3.org/2001/tag/doc/leastPower.html https://www.w3.org/2001/tag/doc/leastPower.html More importantly though, there are a lot of people in the world who know HTML and CSS. The fact that Glimmer templates are "just HTML" makes them accessible to people like designers who may not understand all of the fancy destructuring or array mapping happening in your JSX. Lastly, and this is perhaps just a personal foible, but I have a really hard time mentally mapping more complicated JSX expressions into the final HTML output. It's fine when you're writing it, but reading it later, particularly to write CSS for it, is more challenging for me than Handlebars. I know some people would say that this is a code smell and that I should break that component up into smaller components, but I'd rather that decision be made by me than because I feel forced into it by the muddiness of my render() method.

ng12 10y ago
I absolutely hate any sort of HTML directives or non-trivial templating which in my mind violate the RoLP. You have a fundamentally simple technology and you're shoehorning complexity into it with the end result being there are multiple ways to implement everything. In my mind I'd rather have one tool to do everything -- Javascript. I don't think of JSX as HTML, I think of it more like Elm does -- a way to structure your UI in code which just happens to compile to HTML. As for mapping JSX to HTML I think React's biggest strength is it's composability. But it comes with a price: things start to smell very, very quickly unless you religiously separate concerns.
- boubiyeah 10y ago
  Yeah... That's my experience as well. "Hummm, this string technology was meant for static webpages :( I think the solution is to create an arbitrary sub-language and add more string bits to it to make it dynamic" is more adapted when you quickly want to add a few dynamic behaviors to an existing static template here and there, but not so much when you build a complex app from the ground up. Not to mention these opaque strings suck when you are serious about using a typed language :)
catshirt 10y ago
"The fact that Glimmer templates are "just HTML" makes them accessible to people like designers who may not understand all of the fancy destructuring or array mapping happening in your JSX." isn't this like, at least a little backwards? JSX is HTML and JS. templating languages are HTML with some custom DSL. destructuring and especially mapping are pretty simple concepts. creating a new syntax to cater to people who couldn't learn one in the first place seems counterintuitive? is teaching someone a for loop really at all (let alone significantly) easier than teaching them to map an array? edit: "creating a new syntax to cater to people who couldn't learn one in the first place seems counterintuitive?" on second read this seems thoughtless. isn't that almost the whole point of a DSL? i think you and i have convinced myself to stop hating on templates.
- boubiyeah 10y ago

doublerebel 10y ago

Specialized JS objects can conform to the Virtual DOM spec and therefore be most efficiently rendered by any Virtual-DOM renderer such as React, Maquette, Inferno, etc. It's easiest to use a template language or JS object builder that already conforms to the spec. I use Pug/Jade, which always compiled to JS for speed and also supports Virtual DOM and server-side rendering. Pug can be written, understood, and updated by users who have no knowledge of JS but still gives me the full power of JS when necessary.