我想做的是,当用户首次访问我的Web应用程序以检测其计算机对元素进行动画处理的能力时,运行一个简单且快速的Javascript基准测试。我记得一位老师在大学里这样做是为了根据用户的计算机调整游戏的帧速率。

是否可以在不牺牲太多用户资源的情况下完成某些工作?页面加载几秒钟后?如果结果不好,我们将为此用户禁用部分或全部动画。

最佳答案

要回答您在帖子中提出的问题:

1)当一个人第一次加载您的网站时,可以运行JavaScript基准测试,以测试其CSS / JavaScript动画速度的能力,但会牺牲一些资源。您必须考虑将要访问您网站的人员。如果他们要通过移动设备访问您的网站,那么您要做的最后一件事就是使他们的设备处于静止状态,并冻结他们的浏览器或使其他应用程序内存不足。您不希望台式机或移动用户认为该站点没有响应。

2)页面加载后等待几秒钟的问题之一是,根据您对网站的处理方式,人们将开始尝试滚动浏览您的内容。如果他们开始滚动并意识到该站点“停顿”,他们可能会认为自己的设备有问题。

另一个警告是,如果您想要尽可能平滑的动画,则可能最终使用requestAnimationFrame(请参阅https://hacks.mozilla.org/2011/08/animating-with-javascript-from-setinterval-to-requestanimationframe/)。如果有人在加载您的网站后在测试运行时单击该网站,然后单击该页面的另一个选项卡,则浏览器将采用降低非 Activity 选项卡的帧速率的做法,以偏向 Activity 选项卡的帧速率。基于这种(不正确的)帧速率功能进行的测试将导致完全能够在不影响所有动画的情况下运行您的网站的用户禁用网站的某些部分,因此您可能需要考虑这一点。

在我几个月前进行的一些测试中,动画的CSS3版本几乎总是比动画的JavaScript版本更平滑。但是,现在有jQuery库通过在可能的情况下使用CSS3动画来弥补这种差距,例如jQuery Transit(http://ricostacruz.com/jquery.transit/)。

07-24 09:46
查看更多