Ember 3.23 released 🎉, explore Ember/Glimmer component performance 🚅, read the blog post on the Ember Octane mental model ✍️, Ember + Tailwind 2.0 🎨, learn how to use WebSockets with Ember Data 📟, Glimmer apps with Snowpack 🔥️⛄, and last, but not least, meet fractal-page-object ❄️!
Using @glimmer/component instead of @ember/component can get you up to 2x speed boosts at almost half the memory consumption. -@nullvoxpopuli (source)
Play with the interactive browser demo or explore the source behind a performance comparison of Native JS, Ember Components and Glimmer Components. Feel the performance improvements the core team has achieved for yourself! 🔥
Chris Krycho (@chriskrycho) wrote a blog post on how Ember Octane is not a 1:1 translation from Ember Classic but rather a whole new way of thinking and designing your code. This new programming model means that some patterns that you’re used to using in the Classic paradigm simply do not work in the new paradigm.
Chris goes through a couple examples of code that was fundamentally coupled to Ember Classic idioms such as the Evented API and usage of didReceiveAttrs. The blog argues that although these cases were rare, it’s possible the abstraction would benefit from being reworked substantially towards the Octane idioms.
On the functional CSS train? Now that Tailwind 2.0 is out, you may be looking for guidance on setting it up in your Ember app, as there are some slight differences from Tailwind 1.x. Ray Tiley (@raytiley) put together tailwind-ember-example to demonstrate how to get things configured in Ember. Check out the conversation on Twitter or chime in on GitHub if you have more to add or run into any gotchas!
What's new in Tailwind 2.0? A new color palette, dark mode support, an extra wide 2XL breakpoint, and more. (Note that Tailwind 2.0 is not compatible with IE11, but IE11's end of life is set for 2021.) Check out Tailwind's fancy release trailer video or the blog post for more details.
If you want to learn how to update your Ember app with live data provided by others, Josh Justice (@CodingItWrong) wrote a blog about how to use WebSockets in combination with JSON:API to get live updates in your app.
The blog post is a step-by-step explanation with extensive code examples of using WebSockets with Ember Data. At the end of the blog post you will have a Todo List that will update information of all users to each other. Live updates are a new way of thinking about the data flow in your app, but the libraries that you probably are already using allow you to add them without adding too much code. This blog will give you a nice place to start experimenting with this cool technology.
The post explains how to create a Snowpack app, add dependencies such as Glimmer, and how to configure Snowpack.
It's an exciting foray into new technologies that are built to optimize our experience as developers and users of web technologies.
But that is not all. Rajasegar has also created a create-snowpack-apptemplate to bootstrap your Glimmer app and use Snowpack.
There's also a sample Todo List app built using these exciting new technologies if you want to check it out.