Html5 Video Not Streaming and Taking 90 Seconds to Load

HTML5 video not streaming and taking 90 seconds to load

Because you're having to move the file over the public internet, rather than local network you'll want to use something like ffmpeg to move the meta data (MOOV atom) to the front of the video file so it can start streaming faster

./ffmpeg -y -i SourceFile.mp4 -s 1280x720 -c:v libx264 -b 3M -strict -2 -movflags faststart DestFile.mp4

The above will give you a 1280x720 output, at 3Mbps using h264 in an mp4 container, and will then do a second pass to move the moov element to the front of the file enabling it to start streaming faster (see this answer for some more detail).

You should also check that your Production server configuration matches your dev server, specifically the ability to support byte-range requests that allow more optimal streaming of content

Set up buffering for video object

to process individual uploads you'll want to use something like ffmpeg to move the meta data (MOOV atom) to the front of the video file:

./ffmpeg -y -i SourceFile.mp4 -s 1280x720 -c:v libx264 -b 3M -strict -2 -movflags faststart DestFile.mp4

The above will give you a 1280x720 output, at 3Mbps using h264 in an mp4 container, and will also do a second pass to move the moov element to the front of the file enabling it to start streaming faster. It will not re-encode the audio so will keep whatever quality you started with

You may want to play around with the framesize and the bitrate to get the filesize to match what you like/need.

to do this in the background you'll want to review something like this to call ffmpeg from PHP, or to make use of http://ffmpeg-php.sourceforge.net/ to call it, or if easier use a remote transcode service such as http://ffmpegasaservice.com/

html5 video mp4 not playing in chrome sometimes

I have found out what was wrong. The problem is in Visual Sudio. I am using 2012 and was running my project under it. Then I tried to deploy my project to IIS, opened the page in Chrome and saw that issue was gone.

So the issue is in Visual Studio IIS Express. In a project properties/Web there is a "Servers" section where you can select which web server to use. I have "Use Local IIS Web Server" + "Use IIS Express" selected. It seems that there is some compatibility issue between this web server and Chrome (other browsers are OK), so that video is streaming incorrectly.

What is the limitations of streaming video files in public folder with html5 video tag in Ruby on Rails 5

As long as your underlying web server understands how to handle the MIME types for video, and responds correctly to byte range requests - as it seems to be - that's all you need. The underlying mechanics of streaming video with HTML5 is that the browser asks for a chunk of content as a range of bytes from the source (enough to keep the buffer full) and the server delivers it.

You might want to look at using ffmpeg to optimize your videos so that the metadata is in the right place in the file to start streaming quicker.

You've correctly pointed out the limitations of the solution in your environment. The other thing to be aware of is capacity - if the videos are long and a lot of people are accessing them concurrently then without caching (in a LAN via a caching proxy or on the internet via a CDN service) your server capacity may be stretched

Optimizing HTML5 Video with size

Short answer is yes. The size of your video file will make a difference.
There are a number of things you can do using a tool such as ffmpeg to improve that though - moving the metadata to the start of the file (helps it start playing and seek without having to download the whole file) and optimizing for a particular bitrate

See HTML5 video not streaming and taking 90 seconds to load for some specific suggestions

---

Related Topics