Streams with YouTube
We know that streams are bytes of data that can be used to display text, audio or video and they are used in everyday life.
In this activity we are going to watch a music video on YouTube and we are going to use the
F12 developer tools to take a look at the requests being sent and the byte data that is being sent back in the response.
The video we are going to watch is Only Time by Enya.
Note: This might be a little bit tricky and you may need to use the Clear button often.
Ask your teacher for for help if you can't find it.
What are we looking for?
Before we open the video, let's explain what we are looking for, take a look at the below:
So as you can see we have opened the
F12 developer tools and we have navigated to the
Network tab, we also need to select the
XHR filter as we only want to see XHR requests, everything.
The requests we are looking for are the one that start with
videoplayback can you see them in the animation?
If we look at the Response
videoplayback request we can see that bytes are being returned (the bytes look funny because they are displayed as text).
If you look very carefuly you can also see that each time one of these request returns, the load progress (that is the white bar above the controls) increases, this is because these bytes contained in the
videoplayback request are parts of the video that you are witching, as request are returning, so the video loads, simple isn't it?
Take some time to understand what is going on and what we are looking for.
When you are ready, let's continue.
Watch the video
So without further ado let's watch the video, remember when the video open to immediately open the
F12 developer tools, navigate to the
Network tab and select the
Okay, so click on this link.
Can you see all the
videoplayback request coming in?
So now you can understan how streams are used by media services such as YouTube.
Whilst you are here, make use of the other features of the developer tools and explore the website.
One interesting feature to use is the
Elements tab and the
That's all folks!
What have we learnt?
- Media services like YouTube use streams of bytes.
- We can use the
F12developer tools to see the bytes returned in XHR requests.