The observer tip-jar - Stefan Penner
Why Stack Overflow recommends it
Stack Overflow users link it when answering Ember.js questions where someone reaches for an observer, as a clear explanation of why observers are hazardous and what to use instead.
Recommended by 3 people across 3 different months, 2015 to 2017.
What it is
A 45-minute talk by Stefan Penner at the Silicon Valley Ember.js meetup about when to use observers versus computed properties in Ember. It argues that the two are often confused and shows how to write apps that avoid observers almost entirely.
What people said
Recommends caligoanimus · 2015-06 · Stack Overflow · on “Trigger an action on the change event with Ember.js checkbox input helper?”
Observers are not a good solution to this. Use actions like `on="key-up" action="doSomething"` instead. See [this video] for Stefan Penner's explanation of why observers are poor performers and generally not a good idea.
Recommends Mirza Memic · 2016-06 · Stack Overflow · on “Binding to dynamic route segment”
Just for the reference if you look at Ember doc it states "Observers are often over-used by new Ember developers. Observers are used heavily within the Ember framework itself, but for most problems Ember app developers face, computed properties are the appropriate solution.". This is directly from documentation. I would also recommend that you look at this video [this video] which basically explains my point. But you can use whatever you want. I was just trying to help. cheers.
Recommends Adam Cooper · 2016-08 · Stack Overflow · on “Ember.js Computed Property vs Observer vs didReceiveAttrs() in a Component”
As a general rule you want to avoid the use of observers whenever possible. Steffan Penner has a great video [this video] on observers that I would recommend you watch to truly understand why they are potentially hazardous to your codebase. In your case the load() function is returning a promise which is not something you want to return from a computed property so you will need to use an observer on isAuthenticated. I've simplified your code as much as I can without being able to run it, but hopefully you should get the idea: export default Ember.Component.extend({ layout, session: Ember.inject.service(), currentUser: Ember.inject.service(), user: null, authenticatedObserver: Ember.observer('sess
Cites mfink · 2016-01 · Stack Overflow · on “Ember approach for setting controller computed property from action”
Thanks, this is a potential, although I'm trying to find a way to not use the observer, to avoid the observer tip-jar [this video] , is there anyway to do something similar as a computed property? I'll play with this and report back as well.
Cites M. Wallace · 2016-03 · Stack Overflow · on “should we communicate with component via actions or data”
Before we discuss Observers, the question we're really asking is: Should Components mutate their arguments? If we think of the Component as a function (we pass it data, it does something), we can go up a level of abstraction: Should functions mutate their arguments? This is an old question. It's really about imperative programming (mutable data) vs functional programming (immutable data). Both Ember and React have been moving towards an immutable style, where child Components do not mutate the arguments they're passed. Some examples of this: "Data down, actions up" [LINK] "Unidirectional data flow" [LINK] Ember's Angle-Bracket Components will use one-way binding by default. [LINK] So, the co
Cites Adam Cooper · 2017-02 · Stack Overflow · on “Ember JS: Mapping 3 input in a component to one value”
As a general rule don't use observers [this video] . In your specific case you can just use a computed property with a setter [LINK] , for example: day: 1, month: 0, year: 2000, formattedDate: Ember.computed('day', 'month', 'year', function(){ get(key){ // Create a new date from the three properties const date = new Date(this.get('year'), this.get('month'), this.get('day')); // Return the date formatted however you want it return date.toDateString(); }, set(key, value){ // Create a new date from the value passed in const date = new Date(value); // Set the three properties this.set('day', date.getDate()); this.set('month', date.getMonth()); this.set('year', date.getFullYear()); } })