優化多個HTML5視頻

Question

我在創建的網頁上有多個HTML5視頻。他們自動播放和循環像gifs。

但是，頁面幾乎沒有加載6秒左右的15秒視頻。有沒有一種方法來優化這些視頻，以便頁面加載它們和本身的速度更快？

編輯：

大部分來自Buzzfeed頁有幾十個在一個頁面上的視頻「的GIF」和它們的加載罰款。我想知道我該如何做到這一點？目前瀏覽器變得過載。

Answer 1

大多數設備都具有優化的硬件和軟件來播放視頻，以減少CPU和延長電池壽命等。

一旦您要求設備在同一時間播放多個視頻，就會開始超載任何最佳路徑，並且播放可能會回落到軟件中以完成所有繁重工作。

如果您的特定應用程序可以使用這種方法，單向的方法就是將服務器端的視頻合併到一個視頻中。

通過隱藏主控件並在相關區域添加帶有單獨按鈕的疊加層，您仍然可以使其看起來像單獨的視頻。

如果這不適用於您，那麼將視頻設置爲低帶寬且儘可能短將有所幫助。如果你可以避免autoplaying，這顯然也會有很大的不同。作爲一個說明，Buzzfeed確實在頁面上有多個視頻，但是當我查看他們的頁面時他們不會自動播放，這意味着他們必須下載並顯示的是縮略圖（也許我們正在查看不同的頁面 - 如果你有一個自動播放多個視頻的示例頁面，你可以給一個鏈接嗎？_。