Too many jPlayer instances loaded at once?

[Nathan Loyer]

I have a script that is auto-generating the HTML necessary to create multiple instances of jplayer video players and instantiating them after creating. But with about 9 instances at once, the ajax handler seems to lock up and won't process any more ajax calls to anything, not even local html files after this. I've remediated the problem by creating a custom event handler that instantiates the jplayers, that is only called when those players are visible. But is there some inherent limitation to the number of jplayer instances that can be processed at once? Or is there a problem somewhere else?

[Jonathan2]

This might be an obvious question and I might have missed something, but do ALL these 9 instances HAVE to be running at the same time?

Can some of them not be re-used by firing a different media event at them?

[Maboa]

Nathan,

I've not come across any limitations in instances. Have you got a url we can look at?

However as Johnathan says, you rarely need more than 2 instances of jPlayer (although I can imagine if you are inserting it dynamically it may be convenient). The trick is to swap in different media to the same instance.

Cheers

Mark B

[Nathan Loyer]

Unfortunately, it is a private site for a large client, so I can't provide examples.

Swapping media into fewer instances isn't really an option. I'm showing n articles depending on selections the user makes, and there could be up to 9 videos on the same page. (unlikely, but possible) There isn't a fixed format for where these video players live, and so the video HTML which has IDs (which must be unique) all exist in the DOM at the same time.

I suppose I could dynamically insert the media AND html every time the article is made visible, but I'm not sure that's better than what I've got now. (more instances, loading when visible)

Managing the HTML manually is kind of a pain. I'd like to see jPlayer just attach to an empty div and generate the HTML necessary, with options to massage the output. This is essentially what I've done. I've created an element:

<div class="video" data-path="link/to/video.mp4" data-poster="link/to/poster.png">

Then I load the HTML template (from your Quick Start Guide, slightly modified) asynchronously, and change the IDs to make them unique, and insert them into the above div. I was also then instantiating jPlayer on the newly inserted HTML. (there were about 9 of them) But this caused major problems, locking up the ajax handler permanently, so that no other XHR requests would complete. (all listed as cancelled in the console)

So then, instead of instantiating them upon HTML insertion, I created a custom event handler on the correct jPlayer div to instantiate that instance, and triggered it manually when showing the article. This works, as it spreads the load out. Usually, only one or two videos are visible at a time. But that's just the norm. I can't just switch out media, because the HTML is still in the DOM when the articles are hidden. I need unique IDs across the different articles, so I need a different instance for each one.

I can see how for simpler sites it would be easy to manage simply replacing the media, but that's not an option for me here.

Still curious if someone is able to find some limitation by loading 9 videos all at once. Perhaps there is a hidden bug somewhere.