HTML5画布作为背景

Question

我目前正在设计一个使用画布绘制动画并以动画效果为背景的网站。它看起来不错，但我对性能有一些担忧。

目前，如果它是任何版本的IE浏览器（尽管IE9 + 10支持画布 - 它会减缓它们一点点），现在它回落到平坦的背景，而对于移动/任何其他浏览器而言， t支持画布。

它在我的特殊设置中运行最新的chrome/firefox/safari + opera，但我不知道这是否会使某个体面的浏览器登陆某个人，但性能较差的计算机无法使用该网站。

Answer 1

考虑以下几个因素是非常重要的：

• 浏览器，有些浏览器有帆布差PERF
• 设备，速度较慢的设备将表现不佳，可能影响整个网站的负面

如前所述在评论中，认为背景运动不会太分散注意力也很重要。

使用移动设备和平板电脑，您应该能够合理检测设备是否是您想要运行此设备的设备。

其余的，你可以做一个简单的动态测试：当网站加载了动画背景时，运行性能测试：尝试尽可能快地更新画布。如果使用这个帧率足够高，则可以安全地假设用户的设备能够充分渲染画布。对于fps低于预期的设备，禁用背景。您还可以包含一个用于将来访问的cookie，从而自动禁用/启用背景。