http2最大并发流

Question

I'm a noob about http2 but I think that my issue is related to this. First of all I have this wordpress website https://anekitalia.com that is hosted in my company huge cluster. This is an lxc debian9 container with lamp and http2 mod enabled and I'm using the caching plugin wp rocket. In the home page I have placed two javascripts to randomize the background video and background image(image is visible only on mobile devices). This is the code that I'm using.

<script>
//random video only desktop
var isMobile = 
/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent) ? 
true : false;
jQuery(document).ready(function($){
  if(!isMobile) {
        var video = new Array ();
        video[0] = "/anek-ferry-traghetti-grecia-low.mp4";
        video[1] = "/anek-ferry-traghetti-grecia-v2-low.mp4";
        var randomvideo = Math.floor(Math.random() * video.length);
        $('#random-clip video').attr('src', '/wp-        
 content/uploads/media' + video[randomvideo]);
        $('#random-clip source').attr('src', '/wp- 
content/uploads/media' + video[randomvideo]);
    }
});
</script>
<script>
//random background only mobile
jQuery(document).ready(function($){

 var background = new Array ();
 background[0] = "/traghetti-italia-grecia-anek-fallback1.jpg";
 background[1] = "/traghetti-italia-grecia-anek-fallback5.jpg";
 background[2] = "/traghetti-italia-grecia-anek-fallback2.jpg";
 var randombackground = Math.floor(Math.random() * background.length); 

$("#random-clip.et_pb_fullwidth_header.et_pb_fullwidth_header_0").css({
  'background-image': 'url(/wp-content/uploads/media' + 
background[randombackground] + ')',
    'background-position-y': '35%' });
});
</script>

problem is that if you delete your chrome cache and look at the waterfool, you will notice this the request for background video anek-ferry-traghetti-grecia-v2-low.mp4 starts together with the facebook pixel and google scripts, but stops and then restarts after a little, then stops again and restarts, after that the request for the random background starts. what I'm expecting with http2 is that all requests starts near each other, I cannot understand this fragmentation, so I think that when all the google and facebook scripts starts, they overload the maximux stream request and this is the result. I read that I can increase a settings SETTINGS_MAX_CONCURRENT_STREAMS that maybe can fix this, but as I wrote I'm noob with http2 so I have no idea where to place this directive. Hope that someone can at least point me to a direction. many thanks

Answer 1

The reason your image is requested 3 times is not because of HTTP/2 max concurrent streams (there are not that many in your screenshot), but because the image is downloaded in parts - this is evident from the response status code 206.

You can read more about the 206 status here: https://httpstatuses.com/206 .

What you see is perfectly normal behavior.