Page MenuHomePhabricator

Fresnel: Collect timings from mw.loader.profiler
Open, LowPublic

Description

When running mw.inspect() on a page (as long as $wgResourceLoaderEnableJSProfiler =true; locally) there is a breakdown by module name.

This breakdown measures the amount of time spent a module spends initialising itself when the module closure is initially executed. This is synchronous time and thus important for responsiveness of the user interface to be generally far less than 50ms (given that there are generally many hundreds of modules on a page).

Multi-millisecond values collected by this measure typically indicate that a module is doing DOM work on the page during initialisation which is an anti-pattern (should use rIC instead and/or $.ready). Another common problem is where a module is "merely" attaching events to the DOM, but doing so by running an expensive query selector and iterating over many nodes at once all doing the same mutation (attaching an event listener). This can sometimes add up to 200ms or more even on a decent desktop device. The solution there is usually to use a single delegate event listener, on a shared ancestor higher in the DOM tree.

Anyway, we should collect this data in Fresnel so that we can compare it on commit.

  • The fresnel job enables wgResourceLoaderEnableJSProfiler (unclear how, to be figured out).
  • A probe collects data from mw.loader.profiler.
  • A report compares and displays the data.