Open Bug 1493179 Opened Last year Updated 6 months ago
Load the Code
Mirror sourceeditor component asynchronously only when needed in the markup-view
The markup-view needs the sourceeditor component for when HTML is being edited. However, this only happens when the user right-clicks on a node and select "edit HTML". Looking at the code though, we always load the sourceeditor: https://searchfox.org/mozilla-central/source/devtools/client/inspector/markup/markup.xhtml We load 3 CSS files and the sourceeditor bundle JS file. I did a quick perf comparison test to see if it would be faster to not load these 4 files. Turns out we actually re-load the entire markupview iframe often, so removing those dependencies is important. What I measured: the time it takes to load the markupview iframe. Specifically, I start measuring here: https://searchfox.org/mozilla-central/rev/0b8ed772d24605d7cb44c1af6d59e4ca023bd5f5/devtools/client/inspector/inspector.js#1970 And end measuring here: https://searchfox.org/mozilla-central/rev/0b8ed772d24605d7cb44c1af6d59e4ca023bd5f5/devtools/client/inspector/inspector.js#1998 I measured this time in 3 different scenarios: when the inspector is opened for the first time in Firefox (cold open), when the inspector is re-open after having been closed (re-open), and when switching iframes with the iframe switcher button (iframe). I measured the time 5 times and averaged out the results: with CodeMirror without CodeMirror % cold open 300ms 250ms -16% re-open 290ms 180ms -38% iframe 210ms 50ms -76% So it looks like this is a good perf win across the board worth doing. I haven't looked at how to load the sourceeditor async later when needed, but I'm assuming we can do it (we have all sorts of loaders in devtools).
You need to log in before you can comment on or make changes to this bug.