PhoneGap + jQuery Mobile = 缓慢的点击响应时间

Posted 2023-05-06

【中文标题】PhoneGap + jQuery Mobile = 缓慢的点击响应时间

【英文标题】：PhoneGap + jQuery Mobile = slow tap response time

【发布时间】：2012-12-15 08:41:38

【问题描述】：

我知道互联网上有很多这样的问题，但我尝试了所有解决方案（this question 的所有答案），但都没有奏效。

当我在我的 PC 浏览器中运行该站点时，一切都很好，但是当我在手机上部署时，响应时间非常滞后。

我尝试过使用FastClick，将hoverDelay设置为0，并绑定我自己的事件，但结果是一样的。

我使用的是 android 4.1。除了我尝试过的任何帮助之外，我将不胜感激。

【问题讨论】：

作为参考，这里有一个很好的 JQM 性能调整列表：blog.safaribooksonline.com/2012/07/20/…

【参考方案1】：

要加快 JQM，您必须关闭所有转换。

这很糟糕，但 JQM 转换对于移动设备来说太慢了，即使在 ios 上也是如此。我们只需要等待几年，直到硬件变得更快，我怀疑。尽管 JQM 团队试图在 1.2 中提高性能，但仍然如此。如果我的应用感觉迟钝，我仍然无法使用过渡。

我总是使用这些设置来获得 jQuery mobile 的最佳性能。

$.mobile.defaultPageTransition   = 'none'
$.mobile.defaultDialogTransition = 'none'
$.mobile.buttonMarkup.hoverDelay = 0

同样，如果您正在编写任何 javascript，不要绑定到任何“点击”事件。点击在移动设备上太慢了，因为它在触发事件之前还有 300 毫秒的延迟。

由于您使用的是 JQM，因此您可以改用他们自己的点击事件 vclick（在后台使用 touchstart 和 touchend 事件）。

如果在那之后对您来说仍然很慢，您可能需要检查点击事件中实际发生的情况 - 可能您的代码没有达到应有的优化程度。

【讨论】：

过渡是否与它们真正启动之前发生的事情有关？因为过渡本身在我的手机上运行得完美无缺，正是过渡开始之前的延迟让我感到困扰。此外，我真的没有任何 JS，除了一个自定义加载屏幕，一旦加载了 Cordova 和 JQM，它就会执行 changePage，仅此而已。我将尝试禁用转换并返回反馈。谢谢！

不，抱歉，没有任何过渡，仍然存在滞后。我什至尝试更改 JQM 核心以将 hoverDelay 替换为 0，但仍然没有。

@EduardLuca 我会说此时您需要确定是否是页面中的内容导致了缓慢。有时，如果 JQM 应用程序中的 DOM 变得太大，它会显得很慢。您的页面是什么样子的？哪一点花费的时间太长？

我认为你可能是对的。我在一个文件中有大约 5 页的全部内容，并且我使用锚链接，所以这可能会导致问题。我突然想到这不是唯一的解决方案，还有 AJAX 链接:)

在看到我的应用在 Android 浏览器中遇到问题后，我来到了这里。我禁用了所有动画，尽可能缓存 DOM 查找等。仍然无精打采。我在几个 Android 设备上单独测试了 JQM 演示页面，总体而言它们很慢，所以开箱即用的 JQM 肯定很慢。

【参考方案2】：

如果您想为移动应用解决这个问题，最好使用 tap 事件而不是 click 事件。

通过John Bender阅读Tap vs. Click: Death by Ignorance

【参考方案3】：

这段代码 sn-p 为我工作

var ua = navigator.userAgent, 
event = (ua.match(/iPad|Android/i)) ? "touchstart" : "click";

$("button,a").bind(event, function()

    $(this).trigger('click');
);