simple preload <video>.js

function preloadVideo(video) {
    // just before video would play, pause it
    video.addEventListener('canplay', preloadingVideoCanPlay, {once: true});
    // begin preloading the playlist and first hls segment (useful for VODs)
    video.play();
}

function preloadingVideoCanPlay() {
    // video has buffered enough for playback
    video.pause();
}

function playVideo(video) {
    video.removeEventListener('canplay', preloadingVideoCanPlay);
    video.play();
}

// 1. preloadVideo(video)
// ... some time later ...
// 2. playVideo(video)

two-step preload <video>.js

function preloadVideo(video) {
    video.muted = true;
    // just before video would play, pause it
    video.addEventListener('canplay', preloadingVideoCanPlay, {once: true});
    // begin preloading the playlist and first hls segment (useful for VODs)
    video.play();
}

function preloadingVideoCanPlay() {
    // video has buffered enough for playback
    video.pause();
}

function playVideo(video) {
    video.removeEventListener('canplay', preloadingVideoCanPlay);
    video.play();
}


// 1. preloadVideo(video)
// ... some time later ...
// 2. *tap to enter community* -> playVideo(video)
// 3. on entered community (web view will appear now) -> video.muted = false