Ember Octane and things like angle bracket invocation

Questions
1

Some of the recent upgrades to Ember have been very confusing in terms of what exactly are the differences and what is it that they are trying to achieve. So when things like angle bracket invocation was introduced, did it have something to do with following Web Components (custom elements) ? What exactly did angle bracket invocation help with?

Then, they had Ember Octane. Does that support angle bracket invocation only ? Also what does Ember Octane help ? Is it just performance or anything else ?

2

Hello, there.

Ember Octane is the 1st edition of Ember.js. An edition represents a cohesive programming model and a shift in the programming model due to new features and concepts that are added to Ember.

Angle brackets are an example of a new feature for Octane. They are recommended when you want to invoke a component. However, you can still use double curly braces to invoke the component so that you can gradually migrate your app to Octane.

To me, what angle brackets help with the most is code readability. Before Octane, it was difficult to tell if {{foo}} is a component, a helper, an argument, or a local variable. By introducing angle brackets, <Foo /> can be understood to be a component more readily. (The syntax also invites designers and others who may be familiar with HTML to help out with coding.)

References

I posted a few links below. Each link has sublinks with additional information so I encourage you to check them out! :slightly_smiling_face:

3

Thanks a lot…When you say to distinguish clearly between Ember helpers and components, aren’t helpers currently distinguishable already like {{component (ember-helper)}}

Also, other question is to be able to use the angle bracket invocation, do we really need to upgrade to Ember Octane? I mean do some of the Ember versions themselves (i assume v3.4 and above) not support angle bracket invocation ?

4

Ah, I wasn’t thinking of the component helper, but a helper that you, your team, or another team in your company may have created, or brought in through an Ember addon.

If you are just joining a company, without spending time to research a large codebase, it may be hard to know if {{foo}} means there’s a helper named foo or something else (e.g. an argument named foo, or a local property called foo). In Octane, we try to be more clear about our intention in code.

I think you can use the ember-angle-bracket-invocation-polyfill if your app is version 3.9 or below. According to the README, Ember natively supported angle brackets since 3.10.

5

Thanks…So going ahead, with the newer Ember versions, is it going to be only Octane versions that will be released OR will Ember also continue to upgrade/live in parallel ?

6

Octane is just the name for a set of features which all work well together but which also are backwards compatible with “Classic.” Octane is still Ember! And Ember still has the same strong guarantees about semantic versioning and backwards compatibility it has had for years. You can safely adopt Octane features and they’ll work alongside all your existing code, and upgrades will continue to support both unless and until a specific gesture is deprecated—exactly the same way it has worked for years.