invisible-recaptcha - 无形的recaptcha大幅增加了首次交互时间
问题描述
根据 Lighthouse 的测量,包含 Google 的“隐形验证码”似乎大大增加了“首次交互”(以及随后的“持续交互”)时间。
我使用 HTML5 样板模板设置了两个空网页。这些站点的不同之处仅在于包含了recaptcha API 脚本;即这一行:
<script src='https://www.google.com/recaptcha/api.js'></script>
第一个(非recaptcha)站点接收与第一个有意义的绘制时间相等的第一个交互时间。
第二个(recaptcha)站点的第一个交互时间约为 14 秒,估计输入延迟时间约为 1.6 秒:
我按照 Google 的说明将脚本包含在该<head>
部分的底部,但是我也尝试将脚本包含在<body>
(以及 withasync
和defer
)的底部,但没有明显改进。
这是 Lighthouse 测量首次交互方式(特别是考虑到它仍被标记为“测试版”)或 Recaptcha 的问题吗?如果是后一种情况,这是否值得担心,如果是,有没有办法减轻影响?
解决方案
这也困扰了我一段时间,这是我想出的最佳解决方案:
- 最初不要加载 api.js(渲染验证码)脚本。这很重要,因为与 [2] 相结合会产生相对巨大的交互时间减慢。
- 最初不要将验证码绑定到任何元素,只需在函数中“准备”它以供以后使用。
- 现在,这是最重要(聪明)的部分——当你的用户开始与表单交互时,将 api.js (recaptha__..js) 脚本注入到 header 中,浏览器将加载它,并触发绑定函数加载实际验证码。
您可以在此处通过一些代码示例找到更多信息和解释: https ://tehnoblog.org/google-invisible-recaptcha-how-to-boost-lighthouse-performance-score/
推荐阅读
- javascript - 输入值已设置且可见,但在另一个脚本中无法访问
- powershell - 将管道参数绑定到函数参数时出现空错误
- scala - Scala 函数式编程和可变性
- visual-studio-code - vsCode 设置和切换编程语言
- python-3.x - tensorflow show ImportError: DLL load failed: %1 is not an valid Win32 application
- mysql - 另一个无法在 gcloud 中远程 mysql
- c# - Bot Framework 在对话之外读取 UserState 数据或恢复对话对话
- r - 如何通过 R 中的 For 循环创建许多线性回归模型?
- google-sheets - 如何从 X 单元格中获取最后 2 个数字并将它们添加到 Y 单元格中的 @ 之前?
- machine-learning - Pytorch N - Beats 模型抛出错误:“str”对象没有属性“__name__”