Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>Most people think about video files like <code>.mp4</code> as a files, but in fact <code>avi, mp4, mkv</code> and <a href="http://en.wikipedia.org/wiki/Comparison_of_container_formats" rel="nofollow">many more</a> are just containers that store a lot of information inside of them. The best analogy is an archive (you look at is as one file, but it is many files just grouped together and compressed). Most of the time this container has audio and video inside of it (which are synchronized) and some metadata which helps the program which reads this container to understand what is inside. You can read about codecs and containers <a href="http://www.techhive.com/article/213612/all_about_video_codecs_and_containers.html" rel="nofollow">here</a></p> <p>When you are watching a video you in fact are accessing both of this streams (video and audio). During this time your computer is doing multiple things:</p> <ul> <li>decoding video stream and shows them as a series of images (like animated gifs)</li> <li>decoding audio and forces your speakers to sound it</li> <li>some additional things</li> </ul> <p>In order to know how the navigation through the video (and basically decoding) is working you need to understand how the video is coded. You can read about it <a href="http://en.wikipedia.org/wiki/Video_compression_picture_types" rel="nofollow">here</a>. Basically everything is evolving around three main frames:</p> <ol> <li>I‑frames are the least compressible but don't require other video frames to decode.</li> <li>P‑frames can use data from previous frames to decompress and are more compressible than I‑frames. </li> <li>B‑frames can use both previous and forward frames for data reference to get the highest amount of data compression.</li> </ol> <p>This is done because if you will store a video as a series of .jpg pictures it would be really huge. P-frames and B-frames allows you to save space. (If you once tried to open not fully downloaded video from torrent, and saw that when you are forwarding back and force you can barely see what is inside, right now you know why this happened, P-frames and B-frames do not store all information). So when you are moving forward and backward you are navigating between I-frames. Container stores information about position of these I-frames and allows you to quickly navigate through the file. HTML5 provide you with and API through JS to access this data and when you make your API call <code>mediaElement.currentTime = 122</code> the browser is just converting the time to a offset from which you have to read new information. If you want, you can dive in some opensource browser code and check how exactly is this implemented.</p> <p>Was written during the end of the day so I want to eat and do not have enough time. If you see some inaccuracies - feel free to edit.</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload