July 2017 Glimmer Web Component update


by Sam Selikoff

The last two weeks I've been working closely with Robbie Pitts and others to improve Glimmer.js's Web Component story. Our collaboration began as a result of several organizations investigating Glimmer as a possible technology to share code across product teams.

The story has become all too familiar: mid- to large-size organizations with multiple teams find themselves using several different technologies like Ember, React and Vue simultaneously. As these teams build out more products, it gets harder to maintain consistency in design and UX across their organization. Inevitably, teams look for ways to share common JavaScript and CSS building blocks with all their product teams.

When Glimmer shipped as a standalone library at EmberConf 2017, it came with a simple exporter that could build top-level Glimmer components as Web Components. Because Web Components are so low-level, this made for a very compelling integration story: client-side frameworks like Ember and React — and even server-side technologies like Rails — could load up a single JavaScript file and then render Glimmer-backed Web Components in any template, in the same way they already render any other HTML element. And Glimmer's small size and fast rendering performance meant it'd actually be practical for apps written in other frameworks to consume Glimmer-backed Web Components.

As several of us have picked up this work in earnest over the past few weeks, we've been identifying the missing pieces in the first version of Glimmer's Web Component exporter. Some of these missing pieces have led to upstream changes elsewhere in the Glimmer ecosystem, but the way things look now we are close to having something everyone will be able to play with.

If you'd like to read a bit more about our design decisions and follow our ongoing work, keep your eye on this issue. And if you find yourself working somewhere where you're facing similar problems, let us know here, on Twitter or in the #glimmer Slack channel. The more folks interested & willing to help out with this, the faster we'll get something everyone can start using!

Questions?

Send us a tweet:

Or ask us in Inside EmberMap, our private Slack workspace for subscribers.