I probably have an average internet connection. On YouTube, when I click on a new video, the new page takes about 1 or 2 seconds to load, and the video itself takes another 1 or 2 seconds to start, which sums up to 2 or 4 seconds total. If I had a page were the click only loads the new video, instead of a whole new page, maybe this could be taken down to 1 or 2 seconds total, but is there a solution where one can switch from video A to video B in a manner that appears instant to the user?

Context: I am planning to develop a website that hosts interactive videos. The scenes there are filmed from 44 different cameras at the same time, from different angles. When the user presses a key on his keyboard, the player is supposed to load the video corresponding to the next camera. The cameras are setup so that each one is neighboring 8 others. Intuitively, this could be achieved by loading simultaneously the next few seconds of the 8 neighboring videos, but that probably would be too costly. Is there a better way?

  • 1
    There cant really be - the data needs to be transferred across the wire so either presharing or waiting whole the buffers fill would seem mandatory.
    – davidgo
    Sep 22 '21 at 3:29
  • It seems like you would need to have the second video downloading while the first video is playing. I'm wondering if you could use hidden <divs> that you would show and hide? Here's a JS that you might be able to get some ideas from, labnol.org/internet/light-youtube-embeds/27941 It uses JS to download a video on the user's mouse click.
    – Trebor
    Sep 23 '21 at 13:54

This is not possible without simultaneously buffering the neighboring videos.

Intuitively, if you want the user to be able to switch to another video instantly, that other video must already be buffered and ready to play. This involves pre-loading a few seconds of that video so that the video has some content to play while the browser makes the request to buffer the rest of the video.

If each video neighbors 8 other videos, then that means there are 8 other videos that need to have a big enough buffer in case the user decides to switch to any of them at any moment.

One thing you could consider is to buffer neighboring videos at low-quality, then when the user switches to them you can kick off a process to upgrade the video stream to a higher quality. For instance, 8 videos being buffered in the background at 240p or 360p while the active video is playing at 720p. The user could switch to another video, and if their internet connection is good, then their active stream would upgrade to 720p within a couple seconds.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.