Как оптимизировать сайт на wordpress?

Question

[Руслан Аскаров]

вопрос следующий:
на главной странице есть вставка видео с ютуба через iframe. В следствии этого тест gtmetrix очень ругается на то, что ютуб подгружает скрипт почти на 1мб. Сайт сделан на WP, подключал разные плагины для lazy-load и тд - всё равно этот скрипт подгружается и gtmetrix людо негодует на него. В google page speed первая проблема - сократите время ответа сервера. Подозреваю, что по той же причине. Помогите как можно решить эту проблему! Заранее благодарю

Answer 1

[Вова Дружаев]

Я делал так: плеер верстал сам (картинка, на ней большая кнопка воспроизведения по центру). Картинка с ютуб ролика тянется. Скрипты нет. По клику на кнопку воспроизведения запускается модальное окно - в нем ролик воспроизводится. Вот после клика все скрипты и грузиться начинают.

Почему картинку тянул с ютуба, а не со своего сервера? Я так чекаю доступность видео. Часто бывает правовладельцы заставляют убирать контент и бывало заходишь на страницу - а ролик удален. Таким образом я себе на почту автоматически отправляю письмо если картинка вернула мне 404 ответ. Просто нахожу похожий ролик на ютубе и заменяю ссылки (это я о трейлерах к фильмам)

Answer 2

[Gennick's Macleo]

Сохранить видео к себе на сервер.
Включить кеширование.

Comments

[Руслан Аскаров]

а с внутренних ресурсов лучше влияет на оптимизацию?

Answer 3

[jamtuson]

Подмените iframe картинкой, а ссылку у iframe уберите вовсе.
Как загрузится сайт, то скрываете картинку и вставляете в src ссылку на видео(ссылку можно хранить в data-attr)

Comments

[Руслан Аскаров]

вроде бы решил проблему, прописав в src controls=2, но появилась другая проблема: пропала картинка. сейчас невключенный видосик выглядит как черная картинка с кнопкой включения. может быть знаете, как вставить картиночку в iframe? через background-image не работает(точнее срабатывает на 1 секунду и потом опять черный квадрат)

[jamtuson]

Руслан Аскаров, Картинку в iframe вставить нельзя, так как iframe находится на другом домене.
Нужно смотреть в api ютуба. Там можно настроить ленивую загрузку(показ превью до загрузки видео), вроде, она именно так там реализовано

Answer 4

[Анатолий]

Загрузите страницу полностью, а потом уже показывайте видео!
Т.е. не просто lazy, а с отсрочкой пока документ полностью не загрузится.

Answer 5

[xmoonlight]

1. Запуск видео - только после полной загрузки всех ресурсов страницы.
2. Используйте API Youtube для полного управления загрузкой ролика и его воспроизведением.

Answer 6

[Александр Андрюшкин]

Таймаутом подгружайте iframe к примеру через 3-4 секунды, до этого можно показывать картинку. Этого времени должно хватить, чтобы тестировщики завершили свои тесты, и выдавали хорошие показатели. Мы делали так погрузку скриптов, контент подгружался от действий пользователя (скролл, сдвиг курсора а области документа, клик, тач) либо через 3 секунды просто подгружался. Метод не очень, но у нас сайт полностью на аякс, поэтому решение было лучшим.