1320703 - Lazy load developer-toolbar from inspector frontend

Status: RESOLVED INVALID

(DevTools :: Inspector, defect, P2)

Description

[Alexandre Poirot [:ochameau]]

I recently looked at profiler output while we are opening a toolbox, and there is many valuable info in there.
Loading modules is one of the most consuming action.
We recently droped all lazy load from inspector client (bug 1292184),
this is really wrong as that forces loading everything at once during toolbox startup. Keep in mind that module loading happens in the parent process and is most likely a synchronous process. So loading a lot of modules at once propably hangs the UI while it also delay UI setup as it is a pretty slow operation.

A recent experience highlighted the cost of modules:
https://blog.mozilla.org/nnethercote/2016/11/03/faster-firefox-startup-shutdown-with-add-ons-present/

Here is the list of dependencies loaded by the inspector, sorted from slowest to fastest to load:
  computed.js
    tooltip-overlays.js
      SwatchFilterTooltip.js
        FilterWidget.js
      CssDocsTooltip.js
      SwatchCubicBezierTooltip.js
      SwatchColorPickerTooltip.js
      ImageTooltipHelper.js
    output-parser.js
    box-model.js
    highlighter-overlays.js
  developer-toolbar.js
  markup.js
    html-editor.js
    undo.js
  inspector-search.js
  css-properties.js

I totally agree that we should replace useless lazy load by direct loads,
but there is some obvious lazy load that have a lot of value.
Here, developer-toolbar, that is only to be loaded when we try to do a screenshot. It pulls many deps from gcli that takes a serious amount of CPU and memory to load. CPU that isn't used to load other important stuff necessary to setup the UI!

Comment 1

[Alexandre Poirot [:ochameau]]

https://treeherder.mozilla.org/#/jobs?repo=try&revision=f2a6960cfa13

Comment 2

[Alexandre Poirot [:ochameau]]

https://treeherder.mozilla.org/#/jobs?repo=try&revision=0e64630ae14a

Comment 3

[Alexandre Poirot [:ochameau]]

Talos:
https://treeherder.mozilla.org/perf.html#/compare?originalProject=try&originalRevision=b4f66b8c9491&newProject=try&newRevision=34c5c3737b411b4c0f832e9c26c62334d5b7a0ea&framework=1&showOnlyImportant=0

Comment 4

[Alexandre Poirot [:ochameau]]

Attachment: Bug 1320703 - Lazy load developer-toolbar.js from inspector.

Review commit: https://reviewboard.mozilla.org/r/97084/diff/#index_header
See other reviews: https://reviewboard.mozilla.org/r/97084/

Comment 5

[Alexandre Poirot [:ochameau]]

https://treeherder.mozilla.org/#/jobs?repo=try&revision=f7aef66b5373

Comment 6

[Alexandre Poirot [:ochameau]]

Talos report no win, I imagine we only start seeing one when we already removed gcli from toolbox startup codepath, let's see if that's the case:
https://treeherder.mozilla.org/perf.html#/compare?originalProject=try&originalRevision=22c61f058901671147a7579add72fd2b2a6719ac&newProject=try&newRevision=1c37b16f8a961da05191429398579daf00b60994&framework=1&showOnlyImportant=0

Comment 7

[Alexandre Poirot [:ochameau]]

https://treeherder.mozilla.org/#/jobs?repo=try&revision=06a4483a7146

Comment 8

[Alexandre Poirot [:ochameau]]

https://treeherder.mozilla.org/#/jobs?repo=try&revision=deff27af8665

Comment 9

[Alexandre Poirot [:ochameau]]

Looks like developer-toolbar.js module is no longer a perf issue with bug 1320149 landed.
https://clptr.io/2jpM4lz
  It is only reported to be 3ms load, and doesn't imply other dependencies that isn't already loaded.