Добавление Jquery на страницы AMP - PullRequest
Новая
       45

Добавление Jquery на страницы AMP

1 голос
/ 28 октября 2019

Ускоренные мобильные страницы (AMP) очень привлекательны для меня из-за скорости загрузки.

При запуске платного трафика в масштабе целевая страница, которая мгновенно загружается, может удвоить рентабельность инвестиций.

Я создаю пользовательскую целевую страницу для продукта электронной коммерции. Эта страница будет иметь:

  • Навигационные ссылки в верхней части, которые могут отображаться или скрываться на основе нажатия кнопки
  • Интерфейс опроса, который задает вопросы пользователя и отображает информацию соответственно
  • На основании определенных нажатий кнопок выполните определенные действия. Например, Fire FB ads pixel events
  • Использование прокрутки jquery, чтобы позволить пользователям переходить к каждому разделу на одной странице

Я привык включать Jquery в <head> иписать весь мой код в одном разделе. Это будет загружено, когда DOM загружается ... и все работает нормально. Счастливые дни.

Однако, читая документацию «Включение пользовательского JavaScript в страницы AMP», создается ощущение, что это будет очень сложно. Почти невозможно, исходя из того, что я вижу.

Смотрите здесь: https://amp.dev/documentation/guides-and-tutorials/develop/custom-javascript/

Кажется, мне нужно создать тег для каждой части пользовательского JS. Ссылка на мой файл JS с атрибутом "src". Однако только код в этом теге будет исполняемым файлом JS.

В этой документации также говорится, что

AMP устанавливает ограничение в 150 килобайт пользовательского JavaScript на каждой странице. Этот лимит распределяется между всеми компонентами на этой странице. При использовании библиотеки ее необходимо импортировать в каждый отдельный компонент.

Jquery составляет около 100 КБ ... Если мне нужно включить эту библиотеку в каждый тег <amp-script>, это означает, что я могу физическине использовать более одного тега?

Могу ли я включить все тело в этот тег <amp-script>?

Означает ли это, что у меня должен быть один файл JS, куда я должен скопироватьБиблиотека JQuery там. Тогда есть ли мой код в этом файле?

1 Ответ

0 голосов
/ 28 октября 2019

Насколько я понимаю документацию, вы можете обернуть область, где нужны пользовательские js. Если вам нужен скрипт на всех страницах, просто оберните все тегом amp-script. - Я никогда не делал это сам, но, похоже, стоит попробовать. Мне было бы интересно узнать, сработало ли это. 

<body>
  <amp-script layout="container" src=".../script.js">
    ...
  </amp-script>
</body>

Рассмотрим

Внутренние теги DOM должны быть практически идентичны до и после инициализации.

и

Если ваша логика сценария amp не выполняет предварительную выборку, DOM имеет менее одной секунды для обновления DOM. Если сценарий изменяет DOM за пределами разрешенного окна, это приведет к фатальной ошибке, и компонент amp-script завершит работу Web Worker. Завершенный компонент больше не запускается.

Удачи!

...