I've been writing a lot of demos lately in the REPL I've been working on, limber.glimdown.com

This post will be a collection of demos I've used in response to questions from various community members -- for the purpose of finding these again easily, and maybe other folks will f ind them useful as well.

Loading Remote Data

  • shows how to use loading state
  • keeps the UI stable while new data is loaded / refresh

Demos:

Forms / Inputs

Resources

  • Clock - encapsulated state and providing a single reactive value.

Rendering

Effects

Note that effects should be avoided (in any ecosystem, not just ember). They are an easy thing to grab for, but often a symptom of a bigger problem. Most effects I've seen (whether implemented as helpers (as in the demos below) or as modifiers (like @ember/render-modifiers) should actually just be a @cached getter. Derived data patterns are much easier to debug and provide much nicer stack traces, whereas effects are "pretty much" observers, which can suffer from "spooky action at a distance" or "weird stacktrace".

  • calling a function once
  • calling a function in response to arg changes
  • an effect that relies on auto-tracking to re-run

demos

Originally posted here on the Ember Forums -- there is some additional discussion there as well.