5

I'm trying to pre-load 20 videos at the same time using the HTML5 video tag

<video id="video-detail-<%=id%>" class="video-js vjs-default-skin" 
    loop 
    autoplay="none"
    width="640" height="360">
    <source src="movie.mp4" type="video/mp4" />
</video>

This videos are inside Bootstrap's popovers as templates. To make these videos autoplay I'm using videoJS which is listening on the mouseover event

I'm having a lot of CPU usage, especially on Chrome.

6
  • 3
    Is the CPU usage coming from when you preload or when you play the videos? Because if it's the preloading, you could just stagger the loading (e.g. bring in 5 at a time or so).
    – Will
    Jul 17, 2012 at 20:44
  • 3
    I'm going to bet its the whole 20 videos thing. Have you tired just one video without any effects to see what the CPU use is? if its high with just the video, then you might be able to re-encode the video, less compression usually means lower cpu use. If its the JS then you probably will have to try a few different things to see where its getting the high cpu from.
    – Robert
    Jul 17, 2012 at 20:49
  • The CPU usage is dependent on a lot of things. The used codec and if the system supplies hardware rendering support is one reason, also preloading 20 videos simultaneously means the browser writes 20 cache files at the same time which in turn causes a lot of management overhead for the file system. Jul 17, 2012 at 22:34
  • The high CPU usage could be from a multitude of things. First off, the codec could easily be hogging CPU. Try a different one. Second, 20 videos being pre-loaded at the same time is enough to put a strain on the average PC. Consider spacing out the load times, I'd imagine maybe a 3-5 second interval between a set of 2 or 4 videos would help out quite a bit. Also, try it without JS and see if that fixes it.
    – jzacharia
    Jul 17, 2012 at 23:48
  • Why would the codec effect CPU usage before any of the videos have started playing? Does preload do more than simply cache the files?
    – akoumjian
    Jul 18, 2012 at 23:10

1 Answer 1

3

Try removing autoplay="none". You don't need to set any value to that attribute. Currently video tag reads autoplay and it reproduces the video. Basically it ignores the value.

http://videojs.com/docs/options/

1
  • Yes thanks!. I figured that out by making a plain html file and only adding video Tags
    – Narciso
    Jul 19, 2012 at 0:06

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.