Glimmer.js

Glimmer.js is a front-end templating engine, which is a thin wrapper around Glimmer-VM. It provides a structured framework for:

• building web applications
• routing
• data management
• conventions for organizing your code.

Glimmer.js extends Glimmer-VM by providing higher-level abstractions such as routes, components, services, and templates. It promotes a component-centric development approach, encouraging the separation of concerns and reusability of UI components. It includes development tools and a development server for building and debugging applications. The presence of all the features within Glimmer ecosystem is evident due to the fact that it was being used for building / testing small applications.

Detailed Lifecycle hook definitions and DDAU (Data down Actions Up) concepts with introduced during Glimmer adoption.

For code organizztion, it follows a project structure and some opinionated conventions. It is designed to be fully compatible with Ember.js and uses the Ember.js CLI to generate code & manage project dependencies. Though it can be used without the wrapper of Ember, as it provides a more lightweight alternative for building web applications but with Ember-like concepts.

The Component API introduced with Handlebars were not very intuitive, and introduction of Glimmer with Octane solves certain problem with existing syntax:

• due to curly brackets syntax, it cannot accept html attributes. Adding them becomes relatively painful compared to other frameworks and web-components.
• readability due to declarative syntax, and no wrapper DOM elements
• argument namespacing: immutable args prevent unexpected overrides by parent components, which pass values. Thereby standardizing the public API. Ref: Component unification RFC

Glimmer components have 2 Lifecycle hooks and 3 properties