javascript - 网站性能测试 : How best to approximate computer performance?

Question

我的网页中有一些浏览器密集型 CSS 和动画，我想确定用户是否有一台速度很快的 PC，以便我可以相应地调整内容以提供最佳体验。

我正在使用 http://detectmobilebrowser.com的脚本来检测所有移动设备，我将包含子句 /android|ipad|ipod|playbook|silk/i.test(a)包括所有平板电脑设备。

然而，这并不能也不能真正解决实际的硬件问题。描绘出我正在寻找的东西并没有走得太远。

例如，iPhone 4S 将比移动用户代理检测器所匹配的许多设备更强大，这使其无法脱颖而出。有人可能会(以某种方式)在 Pentium II 机器上运行 Google Chrome 浏览器并想查看我的页面。 (此人可能没有 iPhone 4S)

显然，要真正了解这一点，我必须进行一些实际的性能测试，并且与任何类型的应用程序的性能测试一样，只测试应用程序实际执行的任务类型的性能是有意义的施行。

即使考虑到这一点，我仍然觉得在性能测试例程花费太长时间并且用户变得不耐烦之前，很难获得任何合理准确的数字。所以这可能意味着继续它，除非我希望第一印象是完美的。好吧，实际上恰好是这样。所以我无法摆脱“第一次运行后”测量性能并在以后调整参数。

所以我剩下的就是基本上尝试在初始页面加载时以一种依赖于浏览器渲染和处理速度的方式执行类似的任务，同时不向用户呈现任何内容(以便向用户他们仍然认为页面正在加载)，然后最好在一两秒内获得足够准确的数字来设置实际页面的参数，以动画方式呈现并以一种不像幻灯片的令人愉悦的方式呈现。

也许我可以放置一个整页的白色 <div>在我的测试用例上，这样我就可以防止用户看到正在发生的事情，并希望浏览器不会通过避免完成所有工作而变得聪明。

有人做过吗？

我知道人们会说，“你可能不需要这样做”，或者“一定有更好的方法”或“减少效果的数量”。

我在页面上做任何事情的原因都是为了让它看起来不错。这就是它的全部意义所在。如果我不那么关心这个问题就不会存在。目标是让 javascript 能够确定足够的参数，以便在功能强大的计算机上提供出色的体验，并在功能较弱的计算机上提供还过得去的体验。当有更多的电力可用时，就应该加以利用。所以希望这可以解释为什么这些建议不是问题的有效答案。

Answer 1

我认为这是一个很好的问题，因为它将用户体验放在首位。

我想到了几个想法:

• Microsoft 发布了许多测试来展示 IE 9 和 10 的性能。其中许多测试都侧重于图形性能，例如 this one ，似乎使用 this JavaScript file来衡量绩效。您可能会使用一些代码/概念。

• 加载媒体密集型页面可能需要几秒钟，因此如果您在加载其余内容时开始测试，您就有一点喘息的空间。例如，启动 AJAX/图像请求、运行测试，然后处理响应。

• 要测试图形性能，使用加载图形作为性能测试怎么样？我通常不喜欢“加载”屏幕，但如果网站可能需要几秒钟才能加载，并且最终结果是更好的用户体验，那么这不是一个坏主意。

• 如果您在上面绘制一堆白色形状，白屏的想法可能会奏效(不确定是否有任何引擎足够智能来优化它，因为它是相同的颜色)。

最终，与让用户等待太久相比，我宁愿选择更好的性能和更低的保真度，以及不太准确(但快速)的测试。