The Ember Times - Issue No. 135
Happy Valentine's Day, Emberistas! 💌
Learn about Native Decorator Support from EmberMap 🐹🗺️, review the RFC for splarguments 💖, autotracking! a blog series on reactivity systems 🤖, JSParty podcast with Jen and Chris 📻, and three reasons to switch to angle bracket syntax in Ember Octane 💡!
EmberMap: Learn about Native Decorator Support 🐹🗺️
Check out the latest EmberMap episode of "What's New in Ember." It talks about what the Native Decorator Support feature from Ember 3.10 means for you and why Decorators are important for Ember's adoption of ES classes.
With Ember 3.10, all the core APIs and surrounding ecosystem libraries can start adopting decorators as per the stage 1 or "legacy decorators" implementation which would pave the way for ES classes in Ember. However, the happy path is still to wait until your app is on the Octane release or 3.15 or beyond to start using both ES classes and decorators together for all of your Ember app code.
To check out how to upgrade your app, check out this great Discuss thread on the issue but also be sure to check out the full video on Native Decorator Support on EmberMap.
Autotracking! A blog series on reactivity systems 🤖
Interested in learning more about autotracking, Ember Octane's new reactivity system? Well then, you're in luck 🍀. Chris Garrett (@pzuraq) is starting another super interesting new blog post series on that exact subject!
The first post, which came out at the end of last month, examines what reactivity means and how it relates to declarative and imperative programming models. Even experienced Ember developers will likely get a lot of value out of reading about what these often-used, but rarely fully understood, terms mean.
In an approachable and conversational style, @pzuraq also explains how state is used in these programming models as well as functional programming models. It’s a great intro for anyone looking to learn a bit about reactivity systems.
Bonus 🎉 @pzuraq’s second post about what makes a good reactivity system came out this week!
@pzuraq dives deeper and surveys several reactivity systems:
- HTML/CSS (did you know they are reactive!?)
- Pull-based reactivity systems (e.g. React and the Virtual DOM, Vue and Elm)
There are helpful diagrams and clear explanations to help you better understand the finer points. If you’re looking to learn more about how these models of reactivity are similar and different, then this post is a great read for you.
Be sure to be on the lookout for more updates from the Ember Times team as more of these awesome blog posts are released!
There is no party like an Octane party! 🎊
Jen and Chris talked with the hosts, Kevin Ball (@kball) and Nick Nisi, about Ember Octane, how Ember operates as a framework, and the role of the community within Ember. The podcast got published today, so if you have missed it or want to listen to it again, you can!
All in all, a lovely podcast with two awesome representatives from the Ember core team.
Three reasons to switch to angle bracket syntax in Ember Octane 💡
One aspect of Ember Octane that we, at The Ember Times, enjoy is discovering feedback from developers and teams as they adopt Octane in production apps.
This week, Bekah Cheek at Atomic Object shared how the angle bracket syntax helped her team write readable code and develop new components with ease. We encourage you to have a look for more details, then share your own experience on a blog, Discord, or Twitter!
You can visit the Ember Guides to learn more about the angle bracket syntax and its benefits.
Review the potential future of splarguments 💖
Two years ago the Request for Comments (RFC) #311 made quite a splash: Besides an entirely new invocation syntax for Ember components, it suggested a novel feature that allowed Ember users to pass HTML attributes, such as class, width or tabindex, from the invocation site of a component down to its content. There they can finally be accessed using the so-called splattributes syntax.
Here's a quick reminder of how that looks like - imagine the following markup:
<!-- app/templates/application.hbs --> <!-- invoking a component with several attributes.... --> <MyImageComponent width="320" height="64" alt="My favorite snack" />
<!-- app/components/my-image-component.hbs --> <!-- ...allows access to the attributes in the component's template --> <img ...attributes />
Which will render the component in your app as follows:
<img width="320" height="64" alt="My favorite snacc" />
The efforts to allow Ember devs to write less verbose component templates and to manage deeply nested component invocations successfully continue. This week, Alon Bukai (@Alonski), Ember developer, contributor and Ember Times editor, wrote down an RFC to promote the idea of spreadable arguments.
Similar to splattributes, these would allow the forwarding of component configuration with less verbosity, but in this instance via arguments rather than attributes. You can learn more about the motivation of this feature and how it is used, in the RFC itself. And as always: feel encouraged to leave your thoughts, questions and suggestions in the comments below!
Contributors' Corner 👏
This week we'd like to thank @jgwhite, @rwjblue, @chancancode, @mehulkar, @efx, @wycats, @mansona, @MelSumner, @jenweber, @skaterdav85, @krisselden, @pzuraq, @Turbo87, @chadhietala, @dcyriller and @xg-wang for their contributions to Ember and related repositories! 💖
Got a question? Ask Readers' Questions! 🤓
Wondering about something related to Ember, Ember Data, Glimmer, or addons in the Ember ecosystem, but don't know where to ask? Readers’ Questions are just for you!
Submit your own short and sweet question under bit.ly/ask-ember-core. And don’t worry, there are no silly questions, we appreciate them all - promise! 🤞
Want to write for the Ember Times? Have a suggestion for next week's issue? Join us at #support-ember-times on the Ember Community Discord or ping us @embertimes on Twitter.
Keep on top of what's been going on in Emberland this week by subscribing to our e-mail newsletter! You can also find our posts on the Ember blog.
That's another wrap! ✨
Chris Ng, Jessica Jordan, Jared Galanis, Anne-Greeth van Herwijnen, Isaac Lee, Amy Lam and the Learning Team