CODEWITHSUNDEEP
javascriptgoogle-chrome
Sebastian Olsen
Sebastian Olsen

Reputation: 10888

Chrome requests gets stuck on pending

In my react app, Chrome will stop loading assets after a set number of requests. This results in my app not being able to load anything, and things start to bug. It's only files, it continues to communicate with my API just fine.

enter image description here

As you can see, after about 6 tracks, it just stops loading anything else.

enter image description here

I've tried restarting, resetting, disabling extensions, NOTHING works. And I am not experiencing this problem in any other browsers.

What's really weird is that if I close and re-open my developer tools, suddenly it will load again. And then it will stop after a set number of files again.

Anyone have any idea on what's going on?

Upvotes: 2

Views: 2005

Answers (2)

Anders Elmgren
Anders Elmgren

Reputation: 658

Looks like this has been experienced before in chrome (possible duplicate: Chrom only loading 6 html5 audo tags.

According to this other user, chrome seems to prevent preloading assets for performance reasons, especially for mobile.

Setting <audio controls preload="none"> will load assets as access to them is requested.

EDIT: did you try something like this?: 

function loadAudio(url){
    var audio = new Audio();
    audio.preload = "none";
    audio.controls = "controls";
    audio.src = url;
    audio.volume = "0.3";
    return audio;
  }

var a = loadAudio("http://www.noiseaddicts.com/samples_1w72b820/17.mp3")
document.body.appendChild(a);
<html>
  <head>
  </head>
  <body>
    
  </body>
</html>

Upvotes: 0

Sebastian Olsen
Sebastian Olsen

Reputation: 10888

I've fixed the problem by limiting the amount of audio objects in my app to 5. Other browsers get a bit higher than that, but I do want to say that I think it's stupid Chrome has this limitation. I was storing the Audio objects in memory (An array) so that I could quickly resume audio if it was needed.

Upvotes: 2

Related Questions