I’m currently trying to implement a short video (10 seconds, looping) in a web page. Initially, we tried using HTML5 Video tag with .mov (and H.264 as video codec inside). The file size was a couple MB, but the servers we’re using were at 99% CPU usage – which is way too high because they’re stacked on top of one another and they could burn up if left at that pace for too long.
My question is simply: what is a good way to display a short 10 second looping video inside a web page that limits CPU usage and will keep a descent frame rate? We’re exploring the option of good ol’ Flash (SWF) files, but wanted to get some input. Thanks!
Zach
I’m posting this as an answer as I couldn’t fit it into a comment.
As people have pointed out it’s strange that the server is causing the problem here. Off the top of my head there are only a couple of reason that I can think of for the server to be doing this;
(1) the server has been directed to further compress specific files when it responds, i.e. there’s a setting to gzip .mov files. This could be via your http config file or .htaccess somewhere. If this is the case look in your console at the headers for the received file and check your server config.
(2) Do you have a streaming server installed? Perhaps the quicktime one on darwin/mac, perhaps Red5 or suchlike? There are stream-through bindings which could cause secondary processes to be launched from your http server which can be set but this is pretty unlikely as you’d have to have specially configured these.
Some advice would be not to use the .mov container for the files, you’ll generally have better success using .mp4, webm, ogg/ogv than you will with .mov also when encoding through quicktime you can get annoyances where unless you check the box for ‘prepare for streaming’ or ‘fast-start’ the files don’t play until a lot is downloaded, theres a little command line tool called qt-faststart which will take these non-progressive files post-compression if so.