Add support for Chrome's ASync Stack Tagging API#404
Open
davidtaylorhq wants to merge 2 commits intoBackburnerJS:masterfrom
Open
Add support for Chrome's ASync Stack Tagging API#404davidtaylorhq wants to merge 2 commits intoBackburnerJS:masterfrom
davidtaylorhq wants to merge 2 commits intoBackburnerJS:masterfrom
Conversation
cvx
reviewed
Oct 10, 2022
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.
56ac7a8 to
ea1882f
Compare
davidtaylorhq
added a commit
to discourse/discourse
that referenced
this pull request
Oct 11, 2022
This version of backburner is patched to include - Fix for scheduleOnce/cancel bug: BackburnerJS/backburner.js#402 - Async stack debugging in Chrome: BackburnerJS/backburner.js#404 The async debugging feature is enabled only in debug builds of Discourse to ensure production performance is unaffected. Adding to `vendorFiles` causes the JS to be inserted directly after the `ember-source` bundle. That means that the `backburner` module defined by ember-source will be replaced with the patched version.
davidtaylorhq
added a commit
to discourse/discourse
that referenced
this pull request
Oct 12, 2022
…18549) This version of backburner is patched to include - Fix for scheduleOnce/cancel bug: BackburnerJS/backburner.js#402 - Async stack debugging in Chrome: BackburnerJS/backburner.js#404 The async debugging feature is enabled only in debug builds of Discourse to ensure production performance is unaffected. Adding to `vendorFiles` causes the JS to be inserted directly after the `ember-source` bundle. That means that the `backburner` module defined by ember-source will be replaced with the patched version.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.jsadded 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.