HTML5畫布作爲背景

Question

我目前正在設計一個使用畫布繪製動畫並以動畫效果爲背景的網站。它看起來不錯，但我對性能有一些擔憂。

目前，如果它是任何版本的IE瀏覽器（儘管IE9 + 10支持畫布 - 它會減緩它們一點點），現在它回落到平坦的背景，而對於移動/任何其他瀏覽器而言， t支持畫布。

它在我的特殊設置中運行最新的chrome/firefox/safari + opera，但我不知道這是否會使某個體面的瀏覽器登陸某個人，但性能較差的計算機無法使用該網站。

Answer 1

考慮以下幾個因素是非常重要的：

• 瀏覽器，有些瀏覽器有帆布差PERF
• 設備，速度較慢的設備將表現不佳，可能影響整個網站的負面

如前所述在評論中，認爲背景運動不會太分散注意力也很重要。

使用移動設備和平板電腦，您應該能夠合理檢測設備是否是您想要運行此設備的設備。

其餘的，你可以做一個簡單的動態測試：當網站加載了動畫背景時，運行性能測試：嘗試儘可能快地更新畫布。如果使用這個幀率足夠高，則可以安全地假設用戶的設備能夠充分渲染畫布。對於fps低於預期的設備，禁用背景。您還可以包含一個用於將來訪問的cookie，從而自動禁用/啓用背景。