TLDR: Use for...of
instead of forEach()
in asynchronous code.
For legacy browsers, use for...i
or [].reduce()
To execute the promises in parallel, use Promise.all([].map(...))
const MESSAGES = { | |
400(foo) { | |
// stuff | |
}, | |
404(foo) { | |
// stuff | |
}, | |
500(foo) { | |
// stuff | |
} |
All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.
Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.
elem.offsetLeft
, elem.offsetTop
, elem.offsetWidth
, elem.offsetHeight
, elem.offsetParent
While this gist has been shared and followed for years, I regret not giving more background. It was originally a gist for the engineering org I was in, not a "general suggestion" for any React app.
Typically I avoid folders altogether. Heck, I even avoid new files. If I can build an app with one 2000 line file I will. New files and folders are a pain.
Data Down / Actions Up
Plain JSBin's
Ember Version Base JSBin's
/** | |
* `Ember.MergedArray` is an array that observes multiple other arrays (called source arrays) for changes and includes | |
* all items from all source arrays in an efficient way. | |
* | |
* Usage: | |
* | |
* ```javascript | |
* var obj = Ember.Object.create({ | |
* people: [ | |
* { |