Скорость страницы - есть проблемы с простым использованием атрибута defer?

Google рекомендует, чтобы скрипты были отложены, но они не упоминают defer атрибут <script> тег. Интересно, почему они даже не упоминают об этом, учитывая, что это было уже давно.

Вместо этого они предлагают ввести сценарии в DOM. Есть ли какая-то особая выгода от использования гораздо более простого и чистого defer атрибут?

https://developers.google.com/speed/docs/best-practices/payload?csw=1

Я понимаю, что есть некоторые незначительные проблемы со старыми браузерами, но я не поддерживаю ничего до IE10 и в основном заинтересован в оптимизации для мобильных браузеров.

ОБНОВЛЕНИЕ: Как интересно, оказывается, что вы не можете использовать любую технику загрузки скриптов, если вы используете API Google Maps. API карт использует document.write загружать другие сценарии, поэтому он не может быть использован в отложенном или асинхронном сценарии и не может быть введен в DOM, потому что document.write не будет стрелять Было бы неплохо, если бы Google следовал своим собственным рекомендациям!

1 ответ

Решение

Вы можете предотвратить блокировку скрипта во время загрузки, используя async атрибут в современных браузерах:

<script async
  src="https://maps.googleapis.com/maps/api/js?sensor=false&callback=apiloaded">
</script>

defer Атрибут указывает не загружать вообще, пока страница DOM полностью не загрузится. Отсрочка подразумевает асинхронность.

Для поддержки старых браузеров указанный вами код скорости страницы верен.

При использовании API Карт Google вы должны использовать параметр обратного вызова при асинхронной загрузке API. Это заставляет API использовать динамическую вставку скрипта, а не document.write звонки внутри. Вы также можете указать пустой параметр обратного вызова.

Примечание о скорости страницы

Скорость страницы - отличный инструмент, помогающий оптимизировать веб-сайт. Я перечислил async атрибут, потому что он позволяет загружать API карты параллельно (не блокируя). Рекомендации по скорости страницы могут показывать наиболее распространенный способ уменьшения времени загрузки, но они определенно не единственные.

Оптимизация времени загрузки карты

Другие вопросы по тегам