Performance 寻找在移动设备上测试CSS转换性能的可靠方法

我正在用jquery mobile构建一个功能丰富的移动网站。所有视图中都有一些css过渡、框阴影、渐变

我所关心的是那些使用低级手机的用户浏览我的网站。很多手机都支持过渡，但帧速率很差：我想是老式的Androids、第一台iPad等等。所以对于这种硬件，我想禁用它们（以及非常昂贵的盒影）

现在我要做的是根据用户代理应用此规则：

* {
      box-shadow: none !important;
      -webkit-box-shadow: none !important;
      transition: none !important;
      -webkit-transition: none !important;
      moz-transition: none !important;
      -ms-transition: none important;
      -o-transition: none !important;
   }

然而，这是完全不可靠的：安卓4手机将通过用户代理测试，但可能表现糟糕。更不用说用户可以升级Android版本，甚至在旧硬件上使用自定义ROM。最后，他们可以随时更改其用户代理

我建议的另一个测试是在空白页面上开始宽度/高度转换，然后检查是否及时完成。虽然我可以看到这是可行的，但我不确定这有多可靠，因为一般使用会在DOM中包含更多的元素

---

我想补充一点，我并没有大量使用CSS3效果，我在建立这个网站时考虑到了优化，所以我知道，请不要建议优化或像背面可见性这样的黑客行为。

有几种解决方案，但我想你需要一种只在客户端设备上运行的解决方案

如果是这种情况，则使用以下方法：

首先，您需要下载/使用Modernizer：

您可以使用它来检测哪些设备支持较新的HTML5/CSS3选项。 您需要检查的是：内联SVG支持，您将在以下官方文档中发现它：

旧版本的Android（3.0之前）和iOS（5.0之前）不支持它，找到它吧 在这里：

这是我知道的唯一可靠的客户端解决方案。如果需要更具体的检测，则需要使用服务器端检测。目前最好的一个是WURFL，但它会花费你

---

在我的另一本书里读更多关于它的内容。

有什么问题吗？：）问题是：在没有用户代理测试的情况下，如何检测支持延迟/慢速转换的老式手机呢。SVG检测是一个好主意，我还将研究WURFL。我现在接受你的回答，但愿意接受更多的建议。谢谢