Search the Community
Showing results for tags 'page speed'.
-
Version 1.0.1
Модуль решает проблему долгой загрузки iframe с youtube и увеличивает page speed. Улучшает визуальную часть и дает возможность катомизации: отображение видео в popup, установка своих превью на видео, установка произвольной иконки "play", Для РФ и РБ модуль не продается и поддержка не предоставляется. Все вставки iframe с видео на вашем сайте перед выводом на страницу будут автоматически заменены на превью видео в виде изображений, которые подтягиваются с img.youtube.com/vi. Внимание! Модулю без разницы, каким образом у вас реализован вывод видео (через доп поля, описание товара, доп вкладки или прямо в файле), он собирает конечный код iframe и заменяет на свой именно при рендеринге страницы системой opencart. Т.е весь ваш фунционал остается на месте и видео добавляете на сайт как и раньше. В любой момент модуль можно отключить. ЗАЧЕМ Все знают, что iframe с видео очень сильно загружают страницу и уменьшают скорость загрузки сайта. Особенно это ощутимо (и даже визуально видно), если на странице несолько видео (каждый iframe это доп. запросы и ресурсы). ССЫЛКИ НА ДЕМО 6 видео - разница 30-50% Модуль выключен: https://oc23.likedev.pro/6-video?disable-video-optim и page speed 49/33 - https://developers.google.com/speed/pagespeed/insights/?hl=uk&url=https%3A%2F%2Foc23.likedev.pro%2F6-video%3Fdisable-video-optim&tab=mobile Модуль включен https://oc23.likedev.pro/6-video и page speed 92/75 - https://developers.google.com/speed/pagespeed/insights/?hl=uk&url=https%3A%2F%2Foc23.likedev.pro%2F6-video Страница та же, только в первом случае добавлен параметр ?disable-video-optim , чтобы модуль не срабатывал и можно было увидеть разницу. 1 видео - разница 10-30% И даже с 1 видео показатель достаточно проседает, особенно для мобильных устройств Модуль выключен: https://oc23.likedev.pro/1-video?disable-video-optim и page speed 88/51 - https://developers.google.com/speed/pagespeed/insights/?hl=uk&url=https%3A%2F%2Foc23.likedev.pro%2F1-video%3Fdisable-video-optim&tab=desktop Модуль вкючен: https://oc23.likedev.pro/1-video и page speed 96/80 - https://developers.google.com/speed/pagespeed/insights/?hl=uk&url=https%3A%2F%2Foc23.likedev.pro%2F1-video&tab=mobile Админка https://oc23.likedev.pro/admin/ логин/пароль: demo/demo Кроме того визуально намного симпатичнее превью с иконкой, чем ютубовский iframe, да и возможность открытия видео в popup тоже очень полезна. + мы можем через css стили кастомизировать превью как нам угодно. ВОЗМОЖНОСТИ видео по клику на превью всплывающеее окно с видео по клику на превью произвольные изображение для превью выбор размера превью установка своей иконки на кнопку 'play' (font awesome, html) и ее стилизация через css возможно указать пути для исключения работы модуля поля для камтомных стилей и js ОСОБЕННОСТИ будет работать на всех шаблонах максимально легкий модуль без зависимостей (всего пару строк css и ванильного js, никаких библиотек) будет работать даже без бутстрапа и jquery открытый код ПРИМЕНЕНИЕ увеличение скорости загрузки и в результате лучший показатель page speed кастомизация внешнего вида видео превью вывод видео в popup позволить показывать ваши iframe даже на ограниченном пространстве подмена превью на свои позволит поставить подходящие вам изображения для видео и украсить сайт Если у вас уже есть оптимизация видео от шаблона или каким то модулем - этот модуль вам не нужен или нужен не на всех страницах Если у вас какие-то нестандартные коды iframe - модуль может работать некорректно и нужна адаптация. Чтобы не было черных полос, можно поставить заставки к видео на канале youtube или загрузить свои в папку модуля. ВАЖНО! Предпочтительно использовать режим POPUP для лучшей совместимости с шаблонами, разметкой и адаптивности видео. УСТАНОВКА видео установки (только тут фикс не нужен, остальное - так же) Через установщик в админке загружаете архив модуля ocmod для своей версии опенкарт. Для версий 2.x убедитесь, что у вас уже установлен модификатор localcopy.ocmod, если его нет - установите. PS. Для редактора CKeditor при вставке в режиме кода некоторых тегов, в т.ч и iframe, редактор их чистит. В таком случае делаем фикс : в admin\view\javascript\ckeditor\config.js после строки config.resize_enabled = false; прописать config.allowedContent = true; ЛИЦЕНЗИЯ Лицензия выдается на один домен. Также при необходимости на тестовый поддомен. Ключ будет выслан автоматически на почту покупателя сразу после вашего заказа. Если по какой-то причине письма нет - пишите на почту или в лс. Приветствую дельные предложения по развитию и расширению модуля. ПРОСЬБА УКАЗЫВАТЬ ДОМЕН СРАЗУ ПРИ ПОКУПКЕ Также смотрите модули: Accordion & Tabs & Steps, Faq & HowTo Microdata, any place & content Smart Video Widgets - видео в фоне, баннера, изображения, уведомления с настройкой условий показа Google Reviews - отзывы с гугл карт (Google Business) с виджетом доверия + отзывы о товарах$15 -
15 Завантажити / Придбати розширення YouTube lazy load & popup - оптимизация и кастомизация iframe, увеличение page speed, видео в окне Модуль решает проблему долгой загрузки iframe с youtube и увеличивает page speed. Улучшает визуальную часть и дает возможность катомизации: отображение видео в popup, установка своих превью на видео, установка произвольной иконки "play", Для РФ и РБ модуль не продается и поддержка не предоставляется. Все вставки iframe с видео на вашем сайте перед выводом на страницу будут автоматически заменены на превью видео в виде изображений, которые подтягиваются с img.youtube.com/vi. Внимание! Модулю без разницы, каким образом у вас реализован вывод видео (через доп поля, описание товара, доп вкладки или прямо в файле), он собирает конечный код iframe и заменяет на свой именно при рендеринге страницы системой opencart. Т.е весь ваш фунционал остается на месте и видео добавляете на сайт как и раньше. В любой момент модуль можно отключить. ЗАЧЕМ Все знают, что iframe с видео очень сильно загружают страницу и уменьшают скорость загрузки сайта. Особенно это ощутимо (и даже визуально видно), если на странице несолько видео (каждый iframe это доп. запросы и ресурсы). ССЫЛКИ НА ДЕМО 6 видео - разница 30-50% Модуль выключен: https://oc23.likedev.pro/6-video?disable-video-optim и page speed 49/33 - https://developers.google.com/speed/pagespeed/insights/?hl=uk&url=https%3A%2F%2Foc23.likedev.pro%2F6-video%3Fdisable-video-optim&tab=mobile Модуль включен https://oc23.likedev.pro/6-video и page speed 92/75 - https://developers.google.com/speed/pagespeed/insights/?hl=uk&url=https%3A%2F%2Foc23.likedev.pro%2F6-video Страница та же, только в первом случае добавлен параметр ?disable-video-optim , чтобы модуль не срабатывал и можно было увидеть разницу. 1 видео - разница 10-30% И даже с 1 видео показатель достаточно проседает, особенно для мобильных устройств Модуль выключен: https://oc23.likedev.pro/1-video?disable-video-optim и page speed 88/51 - https://developers.google.com/speed/pagespeed/insights/?hl=uk&url=https%3A%2F%2Foc23.likedev.pro%2F1-video%3Fdisable-video-optim&tab=desktop Модуль вкючен: https://oc23.likedev.pro/1-video и page speed 96/80 - https://developers.google.com/speed/pagespeed/insights/?hl=uk&url=https%3A%2F%2Foc23.likedev.pro%2F1-video&tab=mobile Админка https://oc23.likedev.pro/admin/ логин/пароль: demo/demo Кроме того визуально намного симпатичнее превью с иконкой, чем ютубовский iframe, да и возможность открытия видео в popup тоже очень полезна. + мы можем через css стили кастомизировать превью как нам угодно. ВОЗМОЖНОСТИ видео по клику на превью всплывающеее окно с видео по клику на превью произвольные изображение для превью выбор размера превью установка своей иконки на кнопку 'play' (font awesome, html) и ее стилизация через css возможно указать пути для исключения работы модуля поля для камтомных стилей и js ОСОБЕННОСТИ будет работать на всех шаблонах максимально легкий модуль без зависимостей (всего пару строк css и ванильного js, никаких библиотек) будет работать даже без бутстрапа и jquery открытый код ПРИМЕНЕНИЕ увеличение скорости загрузки и в результате лучший показатель page speed кастомизация внешнего вида видео превью вывод видео в popup позволить показывать ваши iframe даже на ограниченном пространстве подмена превью на свои позволит поставить подходящие вам изображения для видео и украсить сайт Если у вас уже есть оптимизация видео от шаблона или каким то модулем - этот модуль вам не нужен или нужен не на всех страницах Если у вас какие-то нестандартные коды iframe - модуль может работать некорректно и нужна адаптация. Чтобы не было черных полос, можно поставить заставки к видео на канале youtube или загрузить свои в папку модуля. ВАЖНО! Предпочтительно использовать режим POPUP для лучшей совместимости с шаблонами, разметкой и адаптивности видео. УСТАНОВКА видео установки (только тут фикс не нужен, остальное - так же) Через установщик в админке загружаете архив модуля ocmod для своей версии опенкарт. Для версий 2.x убедитесь, что у вас уже установлен модификатор localcopy.ocmod, если его нет - установите. PS. Для редактора CKeditor при вставке в режиме кода некоторых тегов, в т.ч и iframe, редактор их чистит. В таком случае делаем фикс : в admin\view\javascript\ckeditor\config.js после строки config.resize_enabled = false; прописать config.allowedContent = true; ЛИЦЕНЗИЯ Лицензия выдается на один домен. Также при необходимости на тестовый поддомен. Ключ будет выслан автоматически на почту покупателя сразу после вашего заказа. Если по какой-то причине письма нет - пишите на почту или в лс. Приветствую дельные предложения по развитию и расширению модуля. ПРОСЬБА УКАЗЫВАТЬ ДОМЕН СРАЗУ ПРИ ПОКУПКЕ Также смотрите модули: Accordion & Tabs & Steps, Faq & HowTo Microdata, any place & content Smart Video Widgets - видео в фоне, баннера, изображения, уведомления с настройкой условий показа Google Reviews - отзывы с гугл карт (Google Business) с виджетом доверия + отзывы о товарах Автор Seriusis долучення 12.11.20 Категорія Модули Системные требования Метод активации По запросу в ЛС По запросу на почту Ioncube Loader Нет ocStore 3.0 2.3.0.2.4 2.3 2.2 2.1 OpenCart.Pro, ocShop Opencart.pro 2.3 Opencart.pro 2.1 OcShop 2.0.3.х Звернення до сервера розробника Нет
- 31 replies
-
Добрый день. Необходим аудит проекта. Не устраивает скорость ответа сервера, загрузки и отрисовки страниц и т.д. В первую очередь необходимо понять, как оптимизировать страницы категорий и товаров, далее главная и блог, страницы подборов. Пример по странице товара (кэш браузера отключен): Пример категории (кэш браузера отключен): В идеале стремление к TTFB < 200 мс, DOM < 1 c, Load < 2 c (по-другому все показатели Google Page Speed для мобильных и десктопов в зеленой зоне). От вас нужен понятный чек-лист по шагам, что сделать, чтобы этого добиться (минификация скриптов, более производительный сервер и т.д.) и что даст каждый шаг оптимизации (в цифрах не надо - понятно, что это "вилами по воде", но хотя бы как улучшит в общих чертах). ВАЖНО: Различные кэширователи - последний инструмент, о котором стоит вести речь. На это есть 2 причины: 1. Страниц у проекта много (35 К+) и все их не закэшируешь, но краулеры будут обходить все и будут считать, что в целом сайт - плохой. 2. Мы уже пробовали 2 раза внедрять кэширование на базе инструментов различных - начинает ехать верстка, перестают работать формы и тд. БЮДЖЕТ: 5 000 Р P.s. Если есть вопросы - задавайте, за технические и логические ошибки - не ругайте, ибо не программист и могу "плавать" в разных вопросах.