How different are Ember component and Discourse widget?

Components are broadly used across most of Discourse. Where widgets come in useful is on some of our most highly-trafficked elements, such as the topic post stream and the header with its multiple menus.

You’ll often see widgets used in plugins and themes to add to or modify existing widgets.

Take for example this widget in the discourse-calendar plugin:

https://github.com/discourse/discourse-calendar/blob/4e31880f9cf67ca4e04edce06245bdaea7a46875/assets/javascripts/discourse/widgets/going-button.js.es6

This is a button rendered in the original post of a topic. It needs to be a widget because the post itself is rendered as a widget for performance reasons.

BUT if you look on lines 11-17 of that file, you can see a handlebars template defined in the JavaScript via the hbs helper, and in that template are components that are rendered like {{i18n ...}}.

So generally, you can use components unless the UI element is already rendered as a widget. In that case use a widget. And if it makes sense, you can utilize existing components inside the widget.

7 Likes