Generate Graphviz dataflow graphs for your Ember app.
What & Why?
Given some templates:
app/templates/ ├── application.hbs └── components ├── x-bar.hbs └── x-foo.hbs
Running ember trace:
ember trace app/templates/application.hbs | dot -Tpng > docs/images/example.png
Will produce something like this:
These graphs can be useful for analysing how data flows through Ember apps. Put another way, they’re a visual tool for answering questions like “where did this value come from?” and “who owns it?”.
ember install ember-trace
ember trace app/templates/my-route.hbs
This command emits the graph to stdout in Graphviz DOT format. You’ll
probably want to pipe it straight into the
dot program to generate the graph.
ember trace app/templates/my-route.hbs | dot -Tpdf > graph.pdf
Some ember-cli addons emit deprecation warnings on stdout, so you’ll want to
strip those before handing it over to
ember trace app/templates/my-route.hbs | sed 's/^DEPRECATION.*$//g' | dot -Tpdf > graph.pdf
Created as an experiment in early 2018 by the Human Interface Team at Heroku.