Невидимая переплетение массово увеличивается в первый раз - PullRequest
Новая
       39

Невидимая переплетение массово увеличивается в первый раз

0 голосов
/ 14 мая 2018

Включение «невидимой рекаптчи» от Google, по-видимому, значительно увеличивает время «первого интерактивного» (и впоследствии «постоянно интерактивного») измерения, измеренного Lighthouse.

Я создал две пустые веб-страницы, используя шаблон HTML5шаблон.Эти сайты отличаются только включением скрипта API recaptcha;а именно, эта строка: 

<script src='https://www.google.com/recaptcha/api.js'></script>

Первый (не повторяющийся) сайт получает первое интерактивное время, эквивалентное первому значимому времени рисования.non-recaptcha

Второй (повторяющийся) сайт получает первое интерактивное время ~ 14 секунд, а расчетное время задержки ввода ~ 1,6 секунды:

recaptcha

Я включил скрипт внизу раздела <head>, как указано в инструкциях Google, однако я также попытался включить скрипт внизу <body> (а также с async и defer) без заметных улучшений.

Это проблема с тем, как Lighthouse измеряет первый интерактив (особенно учитывая, что он все еще помечен как «бета») или Recaptcha?Если в последнем случае стоит ли беспокоиться об этом, и если да, то есть ли способы смягчить воздействие?

1 Ответ

0 голосов
/ 24 декабря 2018

Меня это тоже некоторое время беспокоило, и это лучшее решение, которое я придумала:

  1. Первоначально не загружать скрипт api.js (render captcha). Это важно, так как в сочетании с [2] создает относительно большое интерактивное замедление времени.
  2. Не привязывайте капчу к какому-либо элементу изначально, просто "подготовьте" ее в функции для дальнейшего использования.
  3. Теперь, это самая важная (умная) часть - когда ваш пользователь начинает взаимодействовать с формой, вставьте скрипт api.js (recaptha __ .. js) в заголовок, браузер загрузит его и запустит функцию привязки загрузить актуальную капчу.

Вы можете найти больше информации и объяснений с некоторыми примерами кода здесь: https://tehnoblog.org/google-invisible-recaptcha-how-to-boost-lighthouse-performance-score/

...