7 ms·
I was at the All Things Open conference this week, and Yehuda Katz gave a talk on Glimmerjs[0]. It was enlightening. The size of your front-end application is
by christophilus 9y ago
I was at the All Things Open conference this week, and Yehuda Katz gave a talk on Glimmerjs[0].
It was enlightening. The size of your front-end application is generally dominated by view code. So, they precompile views into a super simple set of binary VM instructions (making your views very compact). These views don't go through the JS compile / parse phase on the client (saving hundreds of ms, up to seconds on slow devices). They are instantly executable by a small VM written as a JS library, and can be streamed in and rendered as they arrive (the way plain ol' HTML pages do). Turns out to be hella fast, but still gives the benefit of rich client-side rendering capabilities.
[0] https://glimmerjs.com/ https://glimmerjs.com/
- dontlikeitupem 9y agoConsidering the various components of the front end stack - increasing the number and depth of the turtles is a win now? That lady was right - turtles all the way down!
- christophilus 9y agoIf you can get all three of these-- good performance, simple application code, and a rich UI experience-- then yes, it's a win.
- dontlikeitupem 9y agoIf you can get all three of these -- overly complicated bloated stack, NIH compliant newness driven development, and yet another crappy poor UI experience -- then no, it's a loss.
- Can_Not 9y agoHonestly you're just making up non-genuine complaints and criticism in bad faith.
- homero 9y agoWow that site loads instantly
- jonkoops 9y agoTom Dale recently did a a great talk at ReactiveConf about Glimmer that I can highly recommend watching: https://youtu.be/62xd25kEZ3o?t=7h40m https://youtu.be/62xd25kEZ3o?t=7h40m
- zpr 9y agoGlimmer itself is made by Ember?
- juandazapata 9y agoYes, the ember core team is behind Glimmer you can use it today in Ember.
- bm1362 9y agoThat's pretty exciting. I'm curious when we can just compile our views into some IR or byte code that can be natively run. Isn't that kinda what WASM is trying to do?
- alessioalex 9y agoIf I'm not mistaken Angular 2+ also has this. It's named AOT compilation (ahead of time). Edit: so does Vue if you're using vueify (https://github.com/vuejs/vue/issues/4272 https://github.com/vuejs/vue/issues/4272).
- christophilus 9y agoIt's not the same, though. Those are compiling textual templates into executable JavaScript. React/Preact do this automatically, too. What Glimmer does is it converts your views into bytecode (not JavaScript) which can be streamed and run without a JavaScript compilation / parsing phase in the browser. Vue, React, and Angular views all ultimately are translated into JavaScript which has to be compiled / parsed in each browser.
- 1_player 9y agoI'll have a look at Glimmer later, but who executes this bytecode?
- dean 9y ago> They are instantly executable by a small VM written as a JS library Guess you have download the VM on initial page load.
- christophilus 9y agoYes. It's about 18KB of JavaScript.
- keda 9y agoglimmer-vm https://github.com/glimmerjs/glimmer-vm https://github.com/glimmerjs/glimmer-vm
- irrational 9y agoIs it more similar to Vue server-side rendering (https://vuejs.org/v2/guide/ssr.html https://vuejs.org/v2/guide/ssr.html)? Or are Glimmer and server-side rendering two different beasts?
- CyberDildonics 9y agoWhy use binary VM instructions with a VM written in JS instead of just straight binary data? Why does it even need to be instructions in the first place?
- christophilus 9y agoIt needs to be instructions because the views aren't static. They are reactive. So some of the content is static, some might change due to user interaction. The VM understands this fundamentally and optimizes for that.
- nerpderp83 9y agohbar is no longer Planck's Constant but the speed a which a metacircular hypecycle can JIT itself on your runtime.
- CyberDildonics 9y agoI'm not clear on where the logic is needed. Even if there are cells or boxes that need to be a percentage of their parent and/or have min and max sizes etc, that can still just be binary data.
- tomdale 9y agoFor folks who want to play around with this, we've got an interactive playground at https://try.glimmerjs.com/ https://try.glimmerjs.com/ that lets you add components, templates and helper functions. In a nod to The Net, you can click the π symbol in the bottom right corner where you'll get a debug view of the disassembled binary bytecode.
- graphememes 9y agoAnyone thinking on betting on Ember, or Glimmer. Word of advice / wisdom from having built multiple platforms / sites with it: Don't.