Skip to main content
Inspiring
November 20, 2017
Answered

Is it possible to add a preloader to video components in html5 canvas?

  • November 20, 2017
  • 2 replies
  • 616 views

I'm using buttons to play mpg videos but they are 5mb-20mb each and I have alot of them so I'm wondering, is it possible to add a preloader to each video component so the entire project doesn't have to be loaded from the start and take very long before anything is displayed? If so, how ?

    This topic has been closed for replies.
    Correct answer Colin Holgate

    Videos should be instant, and not need a preloaded.

    2 replies

    Legend
    November 20, 2017

    Your question doesn't make sense. You say you DON'T want the entire project to be loaded from the start, but forcing your videos to preload would do exactly that.

    That being said, there is a preload attribute you can add to the video tag, but it's up to browser makers, and then the server hosting the video, whether they honor it.

    Inspiring
    November 21, 2017

    Thanks for the answers, I apologize for the confusion, but basically I wanted to have the videos have their own loading bar, so when you click a button to load a video, each video component will display its own loading bar, as they load. Instead of the entire project (including all the videos) having to be downloaded with 1 loading bar at the start before anything loads, I would rather have the website loaded instantly, even if theres alot of large sized videos. When you click a button to load each video component, they will have their own loading bar as your clicking to play them. So with this method, the large videos will not stop the project from displaying fast initially. How can I go about achieving this? Possible?

    Colin Holgate
    Colin HolgateCorrect answer
    Inspiring
    November 21, 2017

    Videos should be instant, and not need a preloaded.

    Colin Holgate
    Inspiring
    November 20, 2017

    When you say mpg videos, are then MP4, and H.264 encoded? How did you encode the videos?

    These days videos are usually encoded in a way that is stream friendly, and you should be able to play them quickly or randomly jump around the video. You can see that in action when watching a YouTube video, it plays quickly and you can see in the controller that only a little bit of video has been buffered. If you jump to another part of the video it starts soon, and again is only buffering a little bit before it starts to play.

    Is there an example video online that we can try?