Add support for Chrome's ASync Stack Tagging API #404
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
https://developer.chrome.com/blog/devtools-modern-web-debugging/#linked-stack-traces
This enables the Chrome developer tools to link the stack traces of the original event scheduling and the eventual execution on the runloop. This is available in Chrome 106 and above.
To protect production performance, this is disabled-by-default, but can be enabled by setting
Backburner.ASYNC_STACKS = true
. Applications / frameworks could choose to enable this by default in development modes.Given the example code:
With
backburner.js
added to Chrome's 'framework ignore list', it looks like this:The result is somewhat similar to #340, but this new API allows us to implement async stacks without introducing any behaviour change.
When the flag is disabled, this commit does not have any measurable performance impact. Testing in the latest stable chrome (via #403) both before and after, I see 2.07 million op/s in the "Schedule & Flush - function" benchmark.
When the flag is enabled, there is some performance impact. In chrome, with dev tools closed, it makes the micro-benchmark about 60% slower (2,000k op/s → 870k op/s). With dev tools open, it makes the micro-benchmark about 93% slower (2,000k op/s → 138k op/s). Given that performance hit, we probably should not enable this flag by default in production.
Taking Discourse as a real-world example, an initial render of the application results in about 250 jobs being added to the runloop. So even in the worst case 'dev tools open' scenario, with a little maths based on the op/s, we're talking about a 1.7ms slowdown (0.1ms with flag disabled, 1.8ms with flag enabled). For us, that tiny slowdown in development would definitely be worth it for the improved developer experience. It may even make sense as a default for Ember when in Debug mode.