html5 videoタグの重い動画をJSを使って遅延ロードする方法【自動再生 iOS動作確認済】

どうも、こうへいです。 今回の記事は、Javascript Tips!! ってことで、タイトル通りですが、HTML5のvideoタグに重い動画ファイルを読み込む際に、Javascriptを使って遅延ロードする方法です。 自動再生 & iOS12で動作確認しました。 コードはこんな感じ。 実装 <!-- まずはvideoタグを設置 --> <video id="video" muted webkit-playsinline playsinline loop autoplay></video> <!-- js実装 --> <script> function lazyLoadVideo () { var xhr = new XMLHttpRequest(); xhr.open('GET', 'https://mameko.jp/lazymov.mp4', true); xhr.responseT