Video Element Autoload Complete video

Questions
,
1

Am loading a video in threejs and am using video texture for that.
Here’s how am doing that. → 

const UIPopups = new Popups();
const videoElement1 = UIPopups.createVideoElement(
  "./public/videos/video-intro.mp4",
  true,
  false,
  false,
  "auto"
);

const videoTexture = new THREE.VideoTexture(videoElement1);
videoTexture.colorSpace = THREE.SRGBColorSpace;

const spriteMaterial = new THREE.SpriteMaterial({ map: videoTexture });
const sprite = new THREE.Sprite(spriteMaterial);
scene.add(sprite);



 createVideoElement(
    src,
    playsInline,
    controls,
    muted,
    preload = "auto",
    loop = false
  ) {
    const video = document.createElement("video");
    video.src = `${src}`;
    video.playsInline = playsInline;
    video.controls = controls;
    video.muted = muted;
    video.preload = preload;
    video.loop = loop;
    video.load();
    return video;
  }

The issue is related to buffering, I want that complete video should be downloaded first and then it should be played. Am using eventlisteners like loadedmetadata and loadeddata to check whether video loaded or not. But this only loads some part of video. And after reaching it again start loading automatically and play when loaded. I want that first it should load complete video, And only after that it should play.

How can i do so ?
If not possible directly provide me an alternative like other platforms does like youtube, If youtube was not able to play at high quality it reduces the quality and runs it in low quality.
Provide me some guidance if anyone knows how to fix it?

2

Have you tried the canplaythrough event? According to the specification:

The canplaythrough event is fired when the user agent can play the media, and estimates that enough data has been loaded to play the media up to its end without having to stop for further buffering of content.

Disclaimer: I have never used this event, so I’m not sure whether it works as described. But at least it appears to be supported by browsers.

3

Yes it works like that only, It loads enough data to play the audio.
suppose the video is of 28 sec duration. It loads upto like 5 sec to play the video. After that it starts loading video which is causing the issue of buffering.
Because of the buffering only, I want it should play the video continously and do not buffer while playing. Because of that only i want it should download complete video in starting.

Is it possible in some way ?