Wp-rocket: 延迟JS-需要在iOS / Safari上单击两次链接

我也有一个客户也用Flying Scripts插件报告了这一情况。

搜索后，我发现Safari的IOS上存在一个问题，该问题与使用touchstart或touchmove而不使用touchend ，这会使链接双击问题（您需要单击首先单击屏幕上的任何点，然后您可以单击任何链接）

以下链接试图突出显示该问题：
https://stackoverflow.com/a/10340968

在客户现场，我进行了以下更改并解决了该问题：
https://github.com/wp-media/wp-rocket/blob/7ec9d996f004707a57c4c8476090d5bd943051f0/assets/js/lazyload-scripts.js#L91 -L99
将touchmove替换touchmove touchend
将touchstart替换touchstart touchend

与@hellofromtonya核对后，她说：-

这个特殊问题需要进一步调查以找出原因。 他们为什么没有这个问题，为什么这个特定的组合可以解决此问题，而不是在此特定情况下添加补丁程序？
我认为这里的“为什么”将非常有价值，以确保我们不会为其他客户带来其他问题。

因此，我将添加需求：要对研发标签进行调查。

另一种情况： https :
客户报告说这是在手机上的野生动物园和野生动物园中发生的

相关票证： https : //secure.helpscout.net/conversation/1296809928/198688/

相关票证： https : //secure.helpscout.net/conversation/1322836283/206594?folderId=2135277

相关票证： https : //secure.helpscout.net/conversation/1334490646/210819/

相关票证： https : //secure.helpscout.net/conversation/1336672544/211528/
笔记和笔记中的屏幕录制。 Safari和Chrome浏览器均会发生此问题。

搜索后，我发现Safari的IOS上存在一个问题，该问题与使用touchstart或touchmove而不使用touchend ，这会使链接双击问题（您需要单击首先单击屏幕上的任何点，然后您可以单击任何链接）

以下链接试图突出显示该问题：
https://stackoverflow.com/a/10340968

在客户现场，我进行了以下更改并解决了该问题：
https://github.com/wp-media/wp-rocket/blob/7ec9d996f004707a57c4c8476090d5bd943051f0/assets/js/lazyload-scripts.js#L91 -L99

将touchmove替换touchmove touchend
将touchstart替换touchstart touchend
与@hellofromtonya核对后，她说：-

这个特殊问题需要进一步调查以找出原因。 他们为什么没有这个问题，为什么这个特定的组合可以解决此问题，而不是在此特定情况下添加补丁程序？
我认为这里的“为什么”将非常有价值，以确保我们不会为其他客户带来其他问题。

因此，我将添加需求：要对研发标签进行调查。

我尝试了此建议，但不幸的是，它未能解决iOS上的问题（至少对我而言）。

同样的问题。 几天前首次尝试使用此功能，并立即获得报告，称iOS上的链接不起作用，需要双击才能使用。 在2 x iOS 14设备上尝试过并确认此问题，因此暂时禁用。

有任何更新吗？

相关： https :

同样的问题。 任何更新？

WP-Rocket和飞行脚本都遇到相同的错误。 替换touchstart和touchmove没有帮助。

相关： https :

我发生在iOS Chrome浏览器而不是Safari上。 其他人可以确认吗？

我们暂时已将WP Rocket插件删除，此问题已经开放了3个月，而且我认为当前的未解决问题数量（+400）不会很快得到修复。

相关： https :

希望WP火箭尽快添加“修复” :)

开发人员有任何更新吗？ 你在努力吗？

@ wp-media / dev由于我们看到了越来越多的错误，并且由于该错误使该功能无法使用，因此我认为我们需要对其进行优先级排序。 我已将其添加到下一个sprint中，以查看是否可以找到解决方案。 🙏

@ wp-media / dev由于我们看到了越来越多的错误，并且由于该错误使该功能无法使用，因此我认为我们需要对其进行优先级排序。 我已将其添加到下一个sprint中，以查看是否可以找到解决方案。 🙏

听起来不错。 当涉及到速度时，此功能对我的网站有很大的影响，希望再次激活它=）

@arunbasillal不，该问题被标记为需要研发，不能作为冲刺的一部分。 为了使问题成为冲刺的一部分，需要首先对其进行全面整理。

@ wp-media / dev由于我们看到了越来越多的错误，并且由于该错误使该功能无法使用，因此我认为我们需要对其进行优先级排序。 我已将其添加到下一个sprint中，以查看是否可以找到解决方案。 🙏

谢谢！ 我真的很喜欢此功能-如果可以在我所有的网站上使用它，那就太好了！

@ wp-media / productrocket团队对此提供了一些反馈：

• 由于iOS的工作方式，这很棘手。
• 问题是触摸屏实际上并没有很好的悬停选项，除了可以触摸并按住之外-但至少在iOS设备上，触摸屏具有自己的意义（它会加载链接目标的预览帧）。
• 艾哈迈德（Ahmed）之前也曾深入研究此问题，唯一的解决方案是像飞行脚本一样使用超时

由于无法对此功能进行修复，而无需对当前功能的当前方式进行重大更改，因此在进一步操作之前，需要进行进一步的思考。

Need和mouseWheel事件以及setTimeOut。 在诸如Infinite Scroll和其他脚本之类的mouseweel脚本上，工作不正确，如果只有mousewhell，则不会加载下一页。 通常，这适用于所有脚本，并且非常重要。
没有setTimeOut的延迟JS也会导致问题，除了需要两次单击链接。 示例：在俄罗斯市场中，Yandex搜索引擎。 计数器可以使用Webviewer，这是用户操作的记录。 因此，不应延迟脚本：因为在查看用户操作时，应加载站点上的计数器脚本。 而且自然不会加载，因为在查看器中没有任何动作，没有“击键”，“鼠标悬停”，“ touchmove”，“ touchstart”发生。

我真的很想知道WP Rocket团队如何考虑这一点，但是至少必须在x秒后自动加载脚本选项，然后iOS才能解决此问题。

@ wp-media / productrocket团队对此提供了一些反馈：

• 由于iOS的工作方式，这很棘手。
• 问题是触摸屏实际上并没有很好的悬停选项，除了可以触摸并按住之外-但至少在iOS设备上，触摸屏具有自己的意义（它会加载链接目标的预览帧）。
• 艾哈迈德（Ahmed）之前也曾深入研究此问题，唯一的解决方案是像飞行脚本一样使用超时

由于无法对此功能进行修复，而无需对当前功能的当前方式进行重大更改，因此在进一步操作之前，需要进行进一步的思考。

实施超时解决方案的任何时间表？

X秒钟后加载脚本不是解决方案。 这样做与该功能的兴趣恰恰相反。 如果没有找到解决方案，我们将尝试这种方式。

@arunbasillal @ engahmeds3ed您可以重做一些测试吗？

我问是因为我们的网站也遇到了同样的问题。 但是自上周以来，我们再也没有问题了。 是发布我们的新网站还是iOS更新的巧合？

实施超时解决方案的任何时间表？

我们无法提供任何预计到达时间。

@GeekPress当我使用由Dev工具提供的移动窗口大小在Chrome中浏览您的网站时（此功能是否有正式名称？也许是移动预览？），两根手指滚动不会触发包括分析在内的延迟脚本。 对于此线程上的双击问题，您测试了哪个页面和链接？ 首页？

@GeekPress当我使用由Dev工具提供的移动窗口大小在Chrome中浏览您的网站时（此功能是否有正式名称？也许是移动预览？），两根手指滚动不会触发包括分析在内的延迟脚本。 对于此线程上的双击问题，您测试了哪个页面和链接？ 首页？

由于触摸手势的差异，我认为在Chrome开发者工具中使用Mobile Preview进行测试不会获得与在iOS设备上进行实际测试相同的结果。

@Roboonl你是对的，他们应该有所不同。 而且我没有这样做。 我只是想知道，对于WP Rocket，在某些条件下永远不要加载脚本是否可以。

setTimeOut是必需的，或者甚至是必需的。

相关： https :

相关案例： https ：

浏览器：Safari和chrome
设备：iPhone 11 Pro

添加超时触发器还将解决https://github.com/wp-media/wp-rocket/issues/3420

添加超时触发器还将解决＃3420

@piotrbak不确定＃3420与此问题有关。 修复＃3454我应该解决＃3420

@GeekPress据我了解，用户正在网页上滚动，并且没有触发Delay JS。 当时未加载Google Analytics（分析）脚本。

似乎您对https://github.com/wp-media/wp-rocket/issues/3454是正确的，它也与手机有关。 这些问题中的任何一个都可能会解决https://github.com/wp-media/wp-rocket/issues/3420
谢谢

任何更新？

@arunbasillal不能在WP-火箭中添加一个选项，以使其同时排除在某些页面上？
像飞行脚本一样，它们甚至可以选择为某些带有关键字的页面排除“延迟JS”。

另一种情况：
https://secure.helpscout.net/conversation/1417928403/237257?folderId=2683093

由于触摸手势的差异，我认为在Chrome开发者工具中使用Mobile Preview进行测试不会获得与在iOS设备上进行实际测试相同的结果。

@Roboonl已在真实的移动设备上进行了测试。 请在移动设备上尝试我们的网站，您无需单击两次。

@roberthedlund我应该错过一些东西，Flying Script没有找到基于页面的关键字的任何方法。

由于触摸手势的差异，我认为在Chrome开发者工具中使用Mobile Preview进行测试不会获得与在iOS设备上进行实际测试相同的结果。

@Roboonl已在真实的移动设备上进行了测试。 请在移动设备上尝试我们的网站，您无需单击两次。

@roberthedlund我应该错过一些东西，Flying Script没有找到基于页面的关键字的任何方法。

https://ibb.co/qYVyhh6

@roberthedlund好吧，您也可以使用WP Rocket做到这一点。 您只需要进入页面编辑屏幕，打开«WP Rocket Options»元框，然后关闭“延迟JS执行”选项即可。

@roberthedlund好吧，您也可以使用WP Rocket做到这一点。 您只需要进入页面编辑屏幕，打开«WP Rocket Options»元框，然后关闭“延迟JS执行”选项即可。

是的，但不理想，例如要在100多个页面上手动执行此操作。

任何更新？

Android上的Chrome版本3.8.6仍然存在此问题。 我只是尝试了Fying Scripts，然后没有发生双击错误。 对于iOS，即使使用了飞行脚本，也要求观众双击。

任何更新？ 我感到奇怪的是，您仍然没有以任何方式通知WP-rocket用户有关此问题。 在人们激活Delay JS功能之前输入警告通知有多困难？ 在与我联系之前，在各个论坛中看到过如此众多的用户，他们还不知道自己正在遭受这个问题的困扰。 这是一个很大的问题，我认为您应该对此进行警告。

@socialpreneur对于iOS，您要在真实的手机上尝试，而不是在模拟吗？

为什么我要问这个问题？

我可以在我的个人iPhone 8上重试一次，而不必在我尝试过的所有带有Delay JS的网站（包括我们自己的网站）上单击两次。

@GeekPress在包括我和我客户的电话在内的真实移动设备上，因此我不得不完全禁用Delay JS。 飞行脚本也无法正常工作，因此我想这是iOS的局限性。

补充：看来有一些外部或内部脚本导致了此问题。 并非每个使用WP Rocket的Delay JS或Flying Script的站点都具有这种双击症状。 到目前为止，两个没有此问题的站点均未使用adsense。 我认为我们需要收集更多的案例来找出原因。

@GeekPress

@socialpreneur对于iOS，您要在真实的手机上尝试，而不是在模拟吗？

为什么我要问这个问题？

我可以在我的个人iPhone 8上重试一次，而不必在我尝试过的所有带有Delay JS的网站（包括我们自己的网站）上单击两次。

我曾在许多使用Delay JS的网站上进行过尝试，并在真实电话上进行过尝试。 iPhone 8，iPhone SE，iPhone 11以及所有这些都存在此问题。 有时，它首先在“单击”上起作用，然后其他按钮完全停止工作。 因此，问题是真实的。

@socialpreneur您是否尝试过我们的网站（https://wp-rocket.me）？ 正如我所说，在几个网站上尝试后，我无法重现该问题。

我可以知道您使用的iOS版本吗？

@GeekPress并非您看到的一切都是事实。 如果至少有WP Rocket用户遇到问题，那么我们需要做所有事情来解决此问题。 我的iOS为14.4，我将向我的客户询问他的iOS版本。 就像我说的那样，由于在某些站点上使用某些脚本的每个Delay JS插件（WP Rocket，Flying Scripts，Perfmatters）上都会发生这种情况，所以这不仅是您的原因。

它可能是浏览器，但是当我看到此双击问题时，不仅是iOS，而且我在Android及其Chrome上都安装了它，因此显然不仅是iOS问题还是Safari问题。 我只是希望我们能提出一些小技巧或其他功能。php可以绕过某些站点上的这种麻烦。

如果发现任何问题，我会通知您。

补充1：确定，这是第三个出现问题的站点。 也许我可以缩小一些常用脚本的范围。

补充2：到目前为止，仅启用Delay JS不会触发此问题。

但是当我设置一些脚本时，双击/点击开始发生。

补充3：好的，这就是我所发现的。 当我添加“目录”时，双击事件被触发。 对于报告此问题的所有其他用户而言，它可能并不相同，但是到目前为止，这是关键字之一。 Contents Plus目录是插件名称。

补充4：这是个好消息。 另一个具有相同问题的站点也正在使用TOC Plus。 @GeekPress ，请在启用此插件的情况下对其进行测试。 并告诉您所有的支持人员，以确认遇到相同问题的用户是否也在他们的网站上使用了此插件。 尽快。

补充5：我设法通过不延迟TOC Plus脚本解决了其中一个站点的问题。 但是相同的解决方案在另一个站点上不起作用，因此似乎有一些脚本不是延迟友好的。

补充6：我有一种感觉，jQuery版本可能正在解决这个问题。 一个工作站点使用最新版本，另一个工作站点使用旧版本（/wp-includes/js/jquery/jquery.js?ver=1.12.4-wp）。 进一步调试...

@GeekPress除了TOC Plus外，我还发现adsense是双击/点击的原因。 我已经测试了几个网站，并且所有具有不同主题/插件的网站都具有相同的功能。 以下任何adsense关键字都会发生这种情况。

• 谷歌联合
• adsbygoogle
• adsbygoogle.js

重现

1. 无论是否在首屏内，都可以在adsense上建立一个测试站点。
2. 刷新页面，点击标题徽标/文本或移动菜单图标。 此时adsense已加载，但一键打开菜单将无法打开。

解决方案

我不确定，因为这似乎是adsense脚本的设计方式。 可以解决的工作有：

1. 始终在1秒后加载adsense。 因此大多数用户都不会遇到此问题。
2. 在鼠标悬停时预加载adsense（不确定是否可以在移动点击中使用）
3. 告诉用户不要通过adsense获利，这样网站就会变得更快...

@GeekPress我的网站是celmetro.com，当我启用“延迟Javascript执行”时，我也遇到了相同的双击问题，如果列表中没有要延迟的脚本，则没有关系。

相关： https :
他们使用TOC Plus和adsense。
编辑：这是@socialpreneur的附加信息，

我可以通过Chrome移动版（以及通过设置用于将其作为移动版加载的网络开发工具的Chrome桌面）在我的网站上确认该问题