npm / www

community space for the npm website
https://npm.community
69 stars 48 forks source link

Webperf: Preload critical JS assets #364

Open Munter opened 6 years ago

Munter commented 6 years ago

As seen on https://www.webpagetest.org/result/180330_EW_cbad4538b5b1d1bbe428b78cab8b64ab/1/details/ the two seemingly critical javascript bundles that are loaded non-asynchronously in the bottom of <body>, are not initiating their download as early as they could. They are delayed by less critical resources like content images before they start their download.

This might end up slowing down the pages time to interactive, since these are also some of the biggest assets and they will take a bit of time to parse after downloading as well.

If it's impossible to change these bottom-of-body blocking-loaded script up into the head and load them asynchronously, I suggest adding preload hints in the http headers or in the html <head> to immediately initiate this high priority download and shorten the waiting time to getting the page interactive