【问题标题】：Can I avoid reaction delay (nearly 1s) in web pages on iPhone 6?iPhone 6 上的网页能否避免反应延迟（近 1 秒）？
【发布时间】：2015-08-05 06:00:48
【问题描述】：

问题

有什么办法，也许是硬件加速，或者 WebGL，或者 anything，任何东西，我可以做些什么来加快 iPhone 上的触摸反应速度？我真的希望反应立即出现。

我的问题

我注意到，在 iPhone 6 上点击它的图标时，我的菜单需要将近一秒钟的时间才能做出反应，而菜单会立即对桌面上的点击做出反应。我注意到我访问过的所有移动网站似乎都是这种情况，大约 1 秒的延迟真的很烦人，它从 Web 应用程序中消除了那种清晰、反应性的感觉。另一方面，在 iOS 上安装的应用程序会立即对触摸做出反应，所以我知道这不是触摸检测速度。

示例

我创建了一个示例来测试这一点：

var size = 'norm';
var $box = $('#box').on('click', function () {
    if (size == 'norm') {
        $box.css({
            'width' : '1in',
            'height' : '1in'
        });
        size = 'big';
    } else {
        $box.css({
            'width' : '',
            'height' : ''
        });
        size = 'norm';
    }
});

#box {
    width:0.5in;
    height:0.5in;
    margin:0.5in;
    background-color:violet;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="box"></div>

在 iPhone 上点击该框，您就会明白我的意思。

我尝试过的

我尝试在项目样式中插入-webkit-transform: translateZ(0); 以激活硬件加速，但这似乎并没有提高速度。

【问题讨论】：

标签： javascript jquery ios css iphone

【解决方案1】：

使用轻量级插件消除点击延迟，例如 fastClick https://github.com/ftlabs/fastclick

【讨论】：

我明白了，移动浏览器供应商故意添加300ms 延迟来检查它是否是双击，但这是一个考虑不周的想法。相反，为什么不让开发人员有权决定哪些元素应该监听双击？
真实感知。还有一些适合移动设备的事件可以回退，例如点击、触摸开始、触摸结束，它们没有延迟并提供更好的控制

【解决方案2】：

您遇到的是移动浏览器故意延迟以区分触摸和滑动。这是一个有据可查的问题，幸运的是，有很多解决方法可供选择：

FastClick 是一个插件库，旨在消除跨多个设备和浏览器的此问题。
Mobile Chrome 可以关闭延迟。 Firefox 也有类似的方法，IE 有一个 CSS 标志。
您可以注册touchstart 事件而不是click 事件。

Telerik has a fairly recent article regarding your options 用于移动浏览器的当前状态 (2015)。

【讨论】：