Delay loading detect module until page is loaded and idle

[westonruter]

The detect module is loaded via a dynamic import which involves a high fetch priority. No resources for Optimization Detective should ever compete with the loading of any resources for the critical rendering path. So this introduces an inlined detect-loader script module which explicitly waits for the page to be fully loaded and idle before beginning to load the detect module. This wait-until-idle logic was previously in the detect module itself, but it is better to put in inline on the page to delay the loading of the script module.

On a single post template with the LCP element being the featured image, the impact on the LCP-TTFB metric are as follows (capturing the median of 50 requests):

Network Conditions	Before	After	Diff (ms)	Diff (%)
Fast 4G	771.75	766.7	-5.05	-0.65%
broadband	252.85	243.95	-8.90	-3.52%

Network Waterfall

Before

After

[westonruter]

• Update tests to account for the inlined JS.

Related:

The Optimization Detective client-side extension modules are being loaded sequentially:

We should look at loading them in parallel.