Streaming

Now that (almost) no one is on dial-up 256k modems, we typically don't worry about "streaming" smaller files like images.

But giant audio files (like audio books), and especially large video files should be streamed rather than downloaded. At least if you want your user to be able to start consuming the content immediately.

Click to play video

Streaming vs. Downloading

Downloading is when you wait for the entire file to be transferred before you can start using it.
Streaming is when you start using the file immediately while it's still being transferred in the background.

The simplest way to stream a video file on the web (imo) is to take advantage of two things:

The native HTML5 <video> element. It streams video files by default as long as the server supports it.
The Range HTTP header. It allows the client to request specific byte ranges of a file, enabling partial downloads. S3 servers support it by default.

Writing streaming from scratch is hard, but using the right tools makes it pretty easy these days.

Assignment

For this next part, Chrome or Firefox will work - I'm not sure about other browsers. Additionally, your numbers might be a bit different than mine, but should be in the same ballpark.

Open Tubely, make sure you've still got your "horizontal" video uploaded. If you haven't noticed, it's a big one: 10 minutes long!
Right click on the page and click "inspect" to open the developer tools. Go to the "network" tab and click "disable cache".
With the dev tools network tab still open, refresh the page. You should see a few requests fire off
Click on your horizontal video (which will add the <video> element to the page and request the file). You should, interestingly, see 3 requests:

A 206 status code means "Partial Content" - that's because the browser is smart enough to realize that it should not download the entire 100MB+ video before starting to play it. It's downloading just enough to start playing the MP4 file.

With the network tab still open, click the "play" button on the video element. It should start playing immediately, and likely fire off another partial content request to keep downloading more of the video in the background.

Answer the question.