1

I have an HTML file which looks like this

 <html>
    <head>
        <script src="1.js"></script>
        <script src="2.js"></script>
        ...
        <script src="200.js"></script>
    </head>
 </html>

1.js contains just one line 

window.performance.setResourceTimingBufferSize(250);

By default, the resource buffer size in Chrome is 150.

But, when I see all the resources using Resource Timing API, the length of resources is not 200. It keeps varying randomly between 150 to 200.

I know why this is happening. Because, Chrome tries to download the resources in parallel and hence, it registers the resources in Resource Timing API.

The snippet in 1.js

window.performance.setResourceTimingBufferSize(250);

actually gets executed a bit later. Hence, some more resources get added to resource timing buffer. But, not all of them are added.

Is there a way to stop the parallel download of resources? Download the first resource first, let the code execute and then resume downloading of the remaining resources in parallel.

skjindal93
  • 706
  • 1
  • 16
  • 34
  • Why would you load 200 different JS sources ? I think by default, the scripts are loaded synchronously. –  Mar 28 '17 at 10:10
  • It's not about JS sources. I can have other resources too, like images, css etc. The scripts are executed synchronously, but I think they are downloaded in parallel. Modern browsers do so in order to be efficient. – skjindal93 Mar 29 '17 at 05:34
  • Yes, but I can't think of anything to solve the problem. I think you should try to reduce the number of sources you load. Combine them, or don't load them all at the same time. –  Mar 29 '17 at 10:38
  • @skjindal93 I don't think there's an way to make them being downloaded sequentially. Browser's job is to display the content asap. Hence, when a – Ethan Apr 03 '17 at 20:32
  • @skjindal93 However, I find that when there are sequential non-async external JS files exist, Chrome is downloading them sequentially (even in latest ver 57). But chrome doc says that the secondary light weight parser should help in downloading the subsequent JS file in parallel (but execute sequentially). Get to think this is some weakness with Chrome. – Ethan Apr 03 '17 at 20:34

1 Answers1

1

There is the resourcetimingbufferfull event to setResourceTimingBufferSize. It is said no PerformanceResourceTiming objects are to be removed from the performance entry buffer.

var buffSize = 100

if (window.performance && window.performance.addEventListener) window.performance.addEventListener('resourcetimingbufferfull', function(){
  buffSize += 100
  window.performance.setResourceTimingBufferSize(buffSize);
})

When buffer gets full it increments by +100