title: Adding video metadata to beginning of video for range requests?
body: <p>I have a video rendering engine that uses puppeteer to paint frames. It uses javascript and HTML to seek and draw video frame by frame.</p>
  <p>Large videos slow down the rendering significantly, the primary reason being that it's waiting on the network. I don't exactly know how Chrome decides to download the video data on seek, but it can be slow (if there are docs on this please share)</p>
  <p>Often times a (as an example) a 100s video that is 100MB will be trimmed down to 10s by the user, leaving us only needing 10MB. To optimize things even further as Chrome paints a particular frame (at 60fps) we only need around 20kb (rounding up).</p>
  <p>I understand <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Range_requests" rel="nofollow noreferrer">range requests</a> can offer this capability, and to slice the bits I need (aka a frame) on paint/during a network request, the video needs to be encoded correctly.</p>
  <p>I also know that the video needs it's metadata to be available at the start of the video. This post <a href="https://stackoverflow.com/questions/45024915/how-to-make-range-request-for-any-portion-of-a-media-fragment">How to make range request for any portion of a media fragment?</a> assumes a variety of videos are going to be used.</p>
  <p>Lets say we can manipulate it with FFMPEG and set the metadata at the start <code>-movflags +faststart</code> is this enough to enable range request with specifying a portion of the video to retrieve? What all needs to be done to a video before it's possible to use range requests to optimize network calls?</p>
  <p>As an example, it seems YouTube has figured this out, if you look at their network requests they seem to be fragmented. They encode all their uploads to make it possible it seems.</p>