Search the Community
Showing results for tags 'webp'.
-
59 Скачать / Купить дополнение Image COMPRESSOR & Watermark & WebP & Lazy Load etc. by Sitecreator webp + lazy load + watermark + др. оптимизация изображений email разработчика: [email protected] WEBP (создание и вывод) работает везде просто и надежно ! Поддерживаются практически любые операционные системы: Linux Windows 32bit 64bit webp: модуль Компрессор позволяет создавать и выводить webp в браузеры, т.е. позволяет оптимизировать изображения формата jpeg и png. Оптимизируются изображения, которые отдаются (передаются по сети при загрузке страниц сайта) в браузер пользователя. Модуль позволяет отдавать старым браузерам без поддержки webp привычный формат jpeg/png. Модуль Компрессор позволяет использовать webp в качестве исходных изображений, которые могут быть, например, загружены вручную или получены путем импорта (парсинга и т.п.). Webp в папке исходных изображений преобразуются в jpeg, с возможностью дальнейшей обработки (ресайз и т.п.), т.е. webp может быть использован в качестве исходных изображений практически также как jpeg и png, данная возможность является расширенной (платной опцией) и по умолчанию не включена в модуле. К функции оптимизации изображений, создания и вывода сжатого формата webp указанная возможность не имеет отношения, и, по-сути, нужна очень ограниченному количеству заказчиков для специфических условий парсинга. Условия работы модуля Компрессор с webp в качестве исходных изображений (входного формата для последующей обработки): Важное замечание по работе в windows server: Компрессор для opencart всех версий: 1.5, 2.* & 3.0 Для использования на opencart 1.5.* должен быть сперва установлен vqmod (если он отсутствует), обычно в 95% он уже присутствует в движке. Ссылка на подробную документацию по установке: Гугл отмечает положительно в своем аудите выполнение рекомендаций по оптимизации изображений. Модуль Компрессор позволяет уменьшить кумулятивный сдвиг макета за счет задания размеров изображений в HTML до их загрузки и, тем самым, несколько увеличить общую оценку скорости. В определенных случаях это бывает полезно. Обычно гугл рекомендует для уменьшения сдвига макета выполнить рекомендацию: Никакой зависимости от хостера в плане создания и вывода WEBP! Работает WEBP везде почти без всяких условий! Важно чтобы была ОС Linux 64 bit / FreeBSD 11 (12, 13) 64bit или Windows (это будет в 99.9% случаев) В данном решении предусмотрено практически все, включая совместимость с ускорителями Jet Cache (изначально полная совместимость), Turbo (версии для опенкарт 2.1 и 2.3 - полная совместимость), Nitropack (см. примечание по версиям ниже). Остальные кешеры тоже поддерживаются полностью или частично, но с определенными условиями. WEBP (сжатый формат графики) можно теперь получить практически у любого хостера. Не имеет значения есть ли поддержка WEBP у вашего хостера или нет. Такая поддержка WEBP встроена в модуль Компрессор и работает на любой Linux 64 бит / FreeBSD 11 (12, 13) 64bit и Windows. На любом обычном (общем) хостинге всегда работает одна из разновидностей Linux 64 бит, очень редко используется FreeBS. . Linux 32 бит требует наличия 32-х битного софта mozjpeg, optipng, cwebp, такой софт не входит в состав модуля ввиду полной нецелесообразности, т.к. 32-х битные ОС не использует ни один хостер в качестве обычного хостинга и не предлагается хостерами для установки на VDS. Поддерживается любой современный браузер, способный отображать WEBP. Старые браузеры без поддержки webp также не забыты, они получат соответственно jpeg, png. Благодаря современному формату изображений WEBP удается снизить общий вес изображений в среднем в 2-3 раза на страницах сайта, и тем самым выполнить рекомендации Гугла по изображениям для вашего сайта. Модуль уникальный в своем роде, т.к. обеспечивает совместимый вывод WEBP для новых браузеров, а старым отдает соответственно jpeg, png , это справедливо почти всегда и в случае использования облачных технологий вроде cloudflare. Но с одним условием, что сам CloudFlare (или оное облако-кешеровщик) настроен на корректную работу с webp и браузерами с поддержкой webp и без нее. Если облако вроде CloudFlare неверно настроено, то webp может появиться на страницах с заметным опозданием или работать не вполне корректно, можете в таком случае отключить временно или совсем CloudFlare. В случае решений (которые есть в сети), например, "созданных на коленке" вы рискуете оставить пользователей Сафари (старых версий до июля 2020) вообще без изображений при использовании того же cloudflare. Модуль Компрессор содержит набор различных возможностей, отчасти определенные возможности дублируют друг друга, например, есть поддержка нескольких вариантов сжатых изображений (mozjpeg, optipng, webp). Это не означает, что у любого хостера будет возможность использовать все возможности, но будет выбор доступного варианта. Т.е. модуль Компрессор предоставляет возможности с избытком, но нет гарантии, что они могут быть задействованы все одновременно. Например, вы по желанию и возможности можете использовать сжатие изображений за счет mozjpeg или webp, но нет смысла использовать их одновременно, и такая задача одновременного использования не ставилась - разумно использовать лишь что-то одно. Модуль Компрессор создавался с целью выполнения рекомендаций гугла по оптимизации изображений и с целью передачи в браузер пользователя оптимизированных изображений. Исходники (т.е. те, что не в кеше) изображений модуль не сжимает, т.к. в этом нет необходимости поскольку речь идет о загрузке в браузер оптимизированных по весу изображений. Если на странице сайта есть изображение не из кеша изображений (из папки исходников, например, или из любой подобной папки), то для такого изображения будет создан оптимизированный вариант в формате WEBP, и именно WEBP будет передан в браузер, а исходник останется в качестве исходника в нетронутом виде. Основная цель - это уменьшить лишний трафик за счет передачи изображений в сжатом виде конечному пользователю чтобы у этого пользователя ваш сайт открывался быстрее и в целом работал быстрее. У модуля нет основной цели экономии дискового пространства у хостера, хоть и это можно сделать за счет использования технологии mozjpeg для сжатия jpeg изображений в кеше изображений opencart. Но если webp работает в 99.9% случаев, то mozjpeg можно эффективно использовать в 90%. Оптимизация (сжатие) изображений - Гугл PageSpeed одобряет. Теперь настоящий комбайн для работы с изображениями. Управление белыми полями изображений, фоном, размером, обрезкой картинок, отдельное управление изображениями для яндекс-маркета и т.д. Индивидуальные настройки для групп изображений ("всплывающие", "thumb-миниатюры"). "Компрессор" (Image Compressor) обеспечит максимальное сжатие изображений Opencart на обычном хостинге (функция proc_open php нужна для работы mozjpeg, optipng; но создание WEBP в режиме "по расписанию" не требует ее наличия в php, на котором работает ваш сайт) и всегда на VDS. Нужные функции (proc_open) вы можете сами включать даже на обычном хостинге (некоторые это позволяют, но не все). Установка софта для сжатия изображений Опенкарт (mozjpeg и optiPNG, WEBP) полностью автоматизирована в два клика на обычный хостинг и VDS (не требует знаний Linux). Для разработчиков и веб-мастеров, устанавливающих модуль своим заказчикам действует скидка Демо 2 (клиентская часть): http://watermark.sitecreator.pro Демо 2 (админка): http://watermark.sitecreator.pro/admin/index.php?route=extension/module/watermark_by_sitecreator Демо 1.5 (клиентская часть): http://watermark15.sitecreator.pro Демо 1.5 (админка): http://watermark15.sitecreator.pro/admin/index.php?route=module/watermark_by_sitecreator пользователь: DEMO пароль: DEMO Для Opencart 3.0 и Opencart 2.* С поддержкой WEBP, Lazy Load и др. Дистрибутив теперь универсальный (он один) для движка 2-й и 3-й версий. Начиная с версии 1.18.3 совместим со всеми сборками версий движков Opencart (ocstore, opencart.pro, русская сборка и т. д.) 1.5 и 2+ (2.0, 2.1, 2.2, 2.3), 3.0 Файлы движка не заменяются (используется vqmod или ocmod для соответствующих веток движка) Модуль Сжатия Изображений Opencart по максимуму использует возможности imagick (если установлен), что уже позволяет получить лучшие по качеству и размеру изображения. Кроме того, в отличие от дефолтного GD использование imagick позволяет уменьшить размер файла за счет очистки изображения от ненужной информации. Как избежать тормозов во время создания сжатых изображений? При обновлении до версии 1.12.6+ нужно проявить внимание! Внедрена защита "от дурака". Максимум настроек водяного знака Opencart (watermark): его позиция, поворот, прозрачность водяного знака и т. д. Можно настроить ограничение (запретить применять) для водяного знака как по имени файла/папок, так и по размерам. Также можно добавить к имени файла nowatermark , и на данное изображение водяной знак не будет накладываться. Адаптивный ресайз (resize, обрезка) изображения. Вот так работает WEBP Lazy Load модуля Компрессор. Гугл одобряет! Как включить нужную для максимального сжатия функцию? (в случае работы режима cron для создания webp это необязательно) требования: php 5.6+ (5.6; 7.0, 7.1, 7.2, 7.3, 7.4) Версию php у хостера вы можете изменить самостоятельно через панель управления. Ioncube Loader (версия 10+) Дистрибутив универсальный для всех версий PHP. Никаких отдельных файлов для разных версий! Только один установочный файл. Ускорители (кешеры) не влияют на работу водяного знака и сжатых форматов mozjpeg, optipng, но могут неверно влиять на вывод webp. Совместимые ускорители в плане WEBP, т.е. WEBP работает (выводится) корректно (но невозможно гарантировать бесконечную во времени совместимость с будущими версиями программного обеспечения сторонних разработчиков, данные приводятся на момент релиза модуля Компрессор версии 2.1.23): Jet Cache (все известные версии на момент выпуска модуля Компрессор версии 2.1.23) Turbo (версии для опенкарт 2.1 и 2.3 - полная совместимость) NitroPack (тестировался с NitroPack 2.5.3, про более свежие и будущие версии не берусь судить ). Это "старый Nitro". Больше не поддерживается, т.к. разработчик Нитро прекратил его продажу и поддержку. условно совместим (т.е. не всегда и не везде) nitropack.io / NitroPack IO (тестировался только на версии 3.8.1 в режиме включенной в Компрессоре совместимости с кеширующим ускорителем. Не путать с просто "NitroPack"! Возможны некоторые ограничения.) Новые и иные версии NitroPack IO не отслеживаются, совместимость не гарантируется, используете на свой страх и риск. Boost (проверялось только на опенкарт 2.*, не могу судить о версии на которой тестировался, т.к. разработчик в модуле не указал версию. Возможно, что есть несовместимые версии) Lightning (при включении опции совместимости с кеширующим ускорителем в Компрессоре и настройке в Lightning исключения для функции Компрессора [читайте инструкцию], в режиме совместимости эффективность использования webp может быть несколько снижена. Тестировалось на версии Lightning 3.38. Возможны некоторые ограничения.) Начиная с версии 2.1.0 модуль Компрессор позволяет включить повышенную совместимость с почти любым кеширующим ускорителем в режиме вывода webp. Независимо от того была ли сделана специально адаптация модуля Компрессор под конкретный ускоритель или нет. Эта возможность экспериментальная по принципу "как есть", нельзя заранее утверждать, что это будет работать везде на 100%. Например, в таком режиме может работать ускоритель Lightning (но желательно отключить (уменьшить агрессивность) в нем оптимизацию (минификацию) Javascript для HTML). В подавляющем большинстве случаев совместимость с Лайтингом работает, но нельзя гарантировать это со 100% для любого случая. Несовместимые в плане вывода WEBP (за счет модуля) ускорители способны не мешать корректному выводу WEBP если данный вывод делать за счет средств сервера. Например, за счет NGINX Конфиг (config) NGINX для вывода WEBP на VDS или Апачи при возможности (лимитирует хостер). Модуль совместим в плане корректного вывода WEBP (и отдачи для старых Сафари и др. старых браузеров JPEG, PNG соответственно) с ускорителями/кешерами Jet Cache и Turbo (версии для опенкарт 2.1 и 2.3 - полная совместимость) и, вероятно, с остальными. Совместим с NitroPack (тестировался с NitroPack 2.5.3 ). В случае использования модуля для сжатия только JPEG, PNG наличие ускорителя не сказывается на возможностях сжатия. Например, ускоритель Lightning совместим для работы с сжатыми форматами JPEG (mozjpeg), PNG (optipng) и совместим в режиме создания WEBP, но не совместим в режиме отображения картинок для старых браузеров и Сафари, который не понимает WEBP. В случае использования webp нужно понимать, что старым браузерам нужно отдавать jpeg/png. Именно так и работает модуль изначально, но ускорители могут за счет кеширования ломать такой алгоритм, а потому для указанных выше совместимых ускорителей была специально сделана адаптация чтобы не было проблем с webp. Модуль не заменяет файлы , используется ocmod для движка 2.*, аналогично в движке 1.5.* используется vqmod с 1.5.1 версии модуля. Просьба обратить внимание до установки модуля на то, не изменен ли код напрямую (или за счет модификаторов) в файлах (это нужно в том случае если вы собираетесь использовать водяной знак, на работу по созданию и выводу WEBP это не влияет): system/library/image.php, catalog/tool/image.php, admin/tool/image.php. Не гарантируется нормальная работа если у вас в движке были сделаны прямые (или за счет модификаторов) изменения кода указанных выше файлов. Это относится к работе водяного знака и т.п., на работу сжатого формата webp это никак не влияет. Желательно чтобы эти файлы были такими же как в дистрибутиве движка. Адаптация в случае изменений в вышеуказанных файлах может оказаться довольно сложной, пожалуйста, учитывайте этот момент. Для получения всех возможностей модуля предполагается, что файлы движка Опенкарт, отвечающие за работу изображений, не были изменены. Пожалуйста, лицензию запрашивайте, написав мне на почту или в личку. Пояснение к лицензированию. Лицензия предоставляется для одного домена с конкретным доменным именем (без возможности переноса на другой домен). Приобретая модуль вы соглашаетесь с принципом лицензирования. Подробно о лицензировании читайте здесь. mozjpeg, optipng необязателен к установке, это лишь рекомендация для достижения максимального сжатия. Софт mozjpeg, optipng, который входит в состав модуля, предназначен для Linux 64 bit. Этот же софт для Windows вы можете скачать и установить отдельно (ссылки и прилагаемые файлы есть ниже, софт существует как 32-х или 64-х битные исполняемые файлы для Windows, 32-х битный софт может работать на Windows 32 или 64 бит.) Процесс установки этого софта сводится к нажатию двух кнопок в модуле. Это работает как на обычном хостинге, так и на VDS. Самая распространенная "ошибка" после установки. Инструкция по установке дополнительного софта для WINDOWS : (для локальной машины разработчика, например. ). Модуль умеет накладывать водяной знак и сжимать изображения, которые вставлены по прямым ссылкам в описании товара, но с некоторыми условиями. Данная возможность предоставлена в качестве бонуса, но не как обязательная часть (может отсутствовать в дистрибутиве, но может быть предоставлена отдельно по запросу при наличии возможности), на некоторых шаблонах возможна несовместимость (не будет работать) с данной функцией (может потребоваться адаптация) поскольку шаблон может кардинально изменить существующий контроллер. Возможность данного функционала связана с особенностями конкретного шаблона, может потребоваться адаптация и доработка (на платной основе) для конкретного сайта. Для SEO CMS есть отдельное решение. Модуль умеет оптимизировать (сжимать) все изображения ваших шаблонов и логотип сайта. Это в дополнение к сжатию всех изображений, проходящих через движок (картинки товаров, категорий, баннеры и т. д. и т. п.) Для SEO CMS сделано решение, позволяющее также использовать супер-сжатие по максимуму и водяной знак в этом модуле. Сделано как отдельное дополнение к модулям "Компрессор" (Image Compressor) и SEO CMS. Такое решение обусловлено тем, что указанный модуль использует свою библиотеку и модели для работы с изображениями. Сжаты будут даже отображаемые оригиналы, вставленные по прямым ссылкам в статьях. И на оригиналы можно накладывать водяной знак и защищать их от кражи. Любые изменения с оригиналами обратимы. Например, можно менять водяной знак. Решение здесь: SEO CMS mod for Image Compressor & Watermark Решение по работе с фоном исходных изображений здесь: Можно обрезать, добавлять фон, делать аккуратные рамки цветом фона. Данное решение реализовано как плагин к модулю "Компрессор", т. е. все настройки делаются в модуле "Компрессор". Совместимость со специфическими модулями и модификаторами, (затрагивающими системную библиотеку и модель image.php) ПОДДЕРЖКА от автора модуля: Самодиагностика и вывод полезной информации - это первое средство если у вас "ничего не работает". А что это гугл пишет "изменение размера .... уменьшит"? Для работы с фоном исходных изображений (обрезка лишнего фона на исходниках) необходима дополнительная лицензия для работы соответствующего дополнительного плагина к модулю Компрессор. mozjpeg_3.1_x86.zip optipng.zip info.php Корректная работа модуля и совместимость гарантируются только в случае использования официальных дистрибутивов opencart, ocstore или "русская сборка". Решение вопросов совместимости и адаптация в случае использования нестандартного/измененного кода движка опенкарт возможно на платной основе. Добавил sitecreator Добавлено 26.08.2017 Категория Кэширование, сжатие, ускорение Системные требования php 5.6 - 7.4, Ioncube Loader версии не ниже 10+, ОС Linux 64 bit / FreeBSD 11 (12, 13) 64bit или Windows (относится к 99.9% случаев) Метод активации По запросу в ЛС По запросу на почту Ioncube Loader Требуется ocStore 3.0 2.3.0.2.4 2.3 2.2 2.1 1.5.5.1.2 1.5.5.1.1 1.5.5.1 1.5.4.1.2 1.5.4.1.1 1.5.4.1 1.5.3.1 1.5.2.1 1.5.1.3 OpenCart.Pro, ocShop Opencart.pro 2.3 Opencart.pro 2.1 OcShop 2.0.3.х OcShop 1.5.6.4.х Обращение к серверу разработчика Нет
-
cache Модуль Буслік Кэш Full [Поддержка]
buslikdrev posted a topic in Кэширование, сжатие, ускорение
40 Завантажити / Придбати розширення Буслік Кэш Full ИНФОРМАЦИЯ Название модуля: Буслік Кэш - "Buslik Cache" Версия модуля: 1.0 Тип лицензии: Full (полная версия) Тип установки: ocmod, event Язык: Беларуская мова, English language, Latviešu valoda, Lietuvių kalba, Język polski, Русский язык, Українська мова Дата создания: 16.05.2021 Был протестирован на: OpenCart.pro 2.1.0.2.2 и 2.3.0.2.6, OpenCart-"Русская сборка" 2.1.0.2 (rs1), 2.3.0.2 (rs6) и 3.0.2.0 (rs3), ocStore 2.1.0.2.1 и 2.3.0.2.3 - шаблон (default) Название архива: Buslik Cache v1.0 Full OpenCart 2.X-4.X.zip ОПИСАНИЕ Модуль предназначен для уменьшения нагрузки на вашу базу данных и поднятию оценки Google PageSpeed. Плюсы: - скорость работы (в основном, когда ещё не закэшировало страницу 50мс-100мс на OpenServer HDD php 5.4, а на php7+ 30мс-80мс, иногда фиксировалось 150, после кэширования css, js около 10мс, после кэширования страницы 2мс); - функциональность; - вы хозяин кэша (полный контроль); - открытый и минимальный исходный код; - подробная и понятная инструкция. Возможности по кэшу: - поддержка драйверов: APC(u), MemCache(d), Redis, File, Buslik или свой; - можно установить исключение по роуту страницы, или наоборот включить для определённых роутов (например, product/category), названий параметра (например, category_id=10) или keyword (например, category10). При включении определённых страниц можно задать индивидуальное время и разнообразить по config, session, cookie, $_POST, $_GET данным; - можно разнообразить кэш с помощью config, session, cookie данных состоящих даже из массивов; - можно ограничить кэширование страниц по параметрам $_POST, $_GET и размеру файлов, чтобы избежать заполнения дискового пространства сервера; - можно установить ограничение по размеру общего объёма кэша на дисковом пространстве сервера; - из настроек модуля можно чистить кэш: html, css, js, images, logs, pwa, обновлять модификаторы, чистить различные отчёты в БД (просмотры товара, активность пользователей, поисковые запросы, корзина пользователей, сессионные данные);- при редактировании товара, категории и т.д. полный кэш страниц тоже будет очищаться в соответствии id; - можно установить время кэша для страниц, контроллеров, моделей и стандартного кэша OpenCart; - можно кэшировать страницы в 2 прохода, сначала кэш моделей, потом всей страницы; - можно прегенерировать кэш массово согласно параметрам ограничений и другим настройкам под этот функционал. Возможности по Google PageSpeed: - можно установить исключение по роуту страницы, или наоборот включить для определённых роутов (например, product/category), названий параметра (например, category_id=10) или keyword (например, category10). - loading="lazy" изображений, фрейм окон, видео, аудио, html-код модулей; - можно указать атрибуты ширины и высоты для всех изображений; - можно сжать стили, скрипты и html страницу; - можно скачать сторонние стили и скрипты на свой сайт; - можно указать исключение из сжатия стилей и скриптов; - можно сделать замену данных для страниц, стилей, скриптов; - можно указать свои атрибуты для стилей и скриптов; - можно предзагружать шрифты, изображения, видео файлы, стили, скрипты; - можно установить инлайн стили и скрипты вверху, внизу, в отдельном файле, отложить загрузку по событию и таймеру; - можно указать свои стили и скрипты; - можно включить генерацию webp изображений в двух направлениях (png/jpg/gif в webp и обратно); - можно собирать и настраивать критические стили; - не ломает валидацию html-кода. Другие возможности: - дебаг режим показывает скорость кэширования контроллеров, моделей, страниц, библиотеки модуля, сжатия стилей, скриптов и страниц, и др; - логирование медленных запросов; - экспорт настроек из других модулей кэша. ВНИМАНИЕ! Оригинальные файлы магазина не заменяет! Исходный код открыт. Все настройки имеют подробное описание. Автор всегда на связи, когда онлайн. УСЛОВИЯ СОГЛАШЕНИЯ - Beta и Lite версии устанавливаете на свой страх и риск - бэкап базы данных (далее - БД) обязателен; - Модуль (модификатор, дополнение, расширение, приложение) (далее - Модуль) можно устанавливать на 1 домен включая поддомены (одна покупка - один домен); - Редактировать код можно только под нужды своего магазина; - Распространение модуля запрещено; - Техническая поддержка (далее - ТП) осуществляется только при появлении ошибки, бага, глюка (зависания) и не совместимости модуля с заявленными версиями Opencart и шаблонов на момент продажи, при установке на боевой сайт (рабочий хостинг); - Адаптация модуля под другую версию Опенкарта, нестандартный шаблон и сторонние модули - платная; - Автор модуля оставляет за собой право в любое время внести изменение в настоящее условие, описание и исходный код модуля; - Автор модуля оставляет за собой право прекратить ТП пользователям по истечению 365 календарных дней со дня последнего обновления модуля (Full или Beta версии), или со дня окончания продления ТП, или при форс-мажорных обстоятельств; - Автор не несёт ответственности за потерю или находку дохода пользователя из-за работы модуля; - ТП осуществляется при условии соблюдения данного соглашения, пишите в личные сообщения. Для тех кто выбирает опцию неограниченные домены - вам нужно заменить в модификаторах ссылку моего профиля на ваш. Автор buslikdrev долучення 21.05.21 Категорія Кэширование, сжатие, ускорение Системные требования php5.4+ Метод активации Автоматическая активация 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.х Звернення до сервера розробника Нет Да- 5 replies
-
- google pagespeed
- redis
- (and 19 more)
-
pagespeed Буслік Кэш / Buslik Cache Full
buslikdrev posted a topic in Пользовательские обзоры дополнений
Приобрести модуль и узнать о нём подробнее можно здесь: Также рекомендую подписаться на тему поддержки, чтобы следить о ходе разработки и вносить предложения. На текущий момент в модуле реализовано около половины моих мыслей, но мои потребности покрывает. Если будет интерес у людей, то оставшаяся часть будет дописана. Мысли таковы: - упор на оптимизацию кода (сейчас библиотека составляет около 2000 строк); - скорость; - расширенные настройки; - компактность (то есть сколько всего можно в одном поле прописать); - подробное описание полей. Пример настройки демо сайта: Как видим легко и просто. Накидываем всё возможное, потом играемся ставя\убирая в начале строки " ; ", подбирая оптимальное решение. Сложность может быть, когда нужно писать js-код (нужен опыт и фантазия), чтобы разрешить какую-нибудь ситуацию, как в примере с видео окном (не хочу блок отправлять в lazy load html, так как он не хочет тогда отображаться на странице Google PageSpeed - на самом деле такова может быть прихоть заказчика, так как он будет думать, что перестал работать модуль). Для ценителей своего времени, есть возможность заказать настройку от автора (при заказе необязательно приобретать модуль). Большинство вопросов решает функционал "Замена в html-коде", когда отсутствует иная возможность. Например, мы хотим html тег <header> подгружать по скроллу, но в внутри <header> у нас встречается <noscript>, а значит нам нужно произвести его замену, так как loading lazy html построен по принципу применения тега <noscript>. В таком случае в loading lazy html предусмотрен атрибут data-busloadinglazy-remove, который удаляет ненужные теги. Но, есть задача: нам нужно подцепиться к ненужному тегу <noscript>. Для этих целей в функционале замены предусмотрена возможность замены несколько строк. Чтобы заменить такой код: Прописываем в поле "Замена в html-коде": В итоге получим: Обратите внимание на функционал кэша, а именно "Параметры работы" и "Параметры ограничения". Благодаря этим функциям у вас не будет быстро тратиться свободное место на сервере. А если ещё возможность позволит, то при отправки инлайн стилей и скриптов в файл сжатия - размер кэша каждой страницы будет весить на порядок меньше. Почему дисковое пространство может забиваться? Если у вас стоит модуль кэширования страниц целиком, то при отсутствии возможности ограничений по параметрам, любой человек может перебором любого параметра создать кэшированных страниц пока не закончится память сервера. Помимо этих функций модуль по умолчанию кэширует страницы с кодом ответа сервера 200. Точнее не кэширует, если обнаружит в заголовках любой ответ сервера не равный коду 200. Из скриншота настроек модуля вы могли заметить откладывание скриптов метрики и аналитики. Их можно откладывать и нужно для Google PageSpeed, но запустить необходимо как можно раньше (то есть по любым взаимодействиям с вашим сайтом). Google молодцы, даже код под это дело сделали удобным, а Яндекс нужно самому приводить к виду, как у Google. Суть работы такая: создаётся функция, она срабатывает и сохраняет время начала работы. После загрузки основного скрипта метрики и аналитики, они получают данные, на которые основывают поведенческий фактор. Обратите внимание, что у Яндекс метрики можно управлять временем одной из функций поведенческого фактора с помощью accurateTrackBounce - событие без отказов регистрируется через 10 секунд (учёт отказов). Суровый Google PageSpeed: Да нет, не суровый хоть и изменил алгоритм на суровый, просто сеть плохая между моим хостингом и сервером Google PageSpeed. В браузере страница загружается за пол секунды, а Google PageSpeed пишет про 2 секунды (First Contentful Paint 1,5 секунды на сетевой доступ + 0.5 секунды на загрузку содержимого). Это тот момент, когда правильный выбор хостинга или сервера практически решает вопрос по баллам Google PageSpeed. Есть ещё радикальный вариант - переписать стили, распределив по файлам, чтобы они точно относились по контроллерам и переписать весь код из jQuery на чистый js (это изначально нужно делать при проектировании шаблона), или придумать обвёртку, которая даст возможность отложить любые скрипты на jQuery. Если нет возможности переписать стили, то можно попробовать функцию модуля "Сбор критических стилей" и "Замена в css-коде, js-коде". С помощью инструмента "Coverage" Google Chrome можно найти ненужные стили и закомментировать, не трогая стили зависящие от ширины экрана (нужно иметь ввиду), подробности тут. Немного сократив стили bootstrap 3 (закомментировал иконки и загрузку шрифтов google), я могу в принципе метрику google запускать после загрузки страницы: Но, я никогда себе не поставлю метрику на рабочий проект и не буду лишать себя скорости, а своих клиентов анонимности: Поэтому прежде чем прибегать к оптимизации модулем, подберите себе хостинг или сервер (подбор хостинга или сервера с настройкой под ключ можете заказать у @snastik). После получения нормального сервера, возможно, простого сжатия стилей и скриптов будет достаточно (а такая возможность во многих шаблонах есть, а если нету, то есть лайтовая версия Буслік Кэш). -
Зашел я сегодня посмотреть свежую ленту форума и увидел очередное хамство нашего героя: Это ужасно, ужасно ужасно в рамках поддержки платного дополнения, которое только разводит и не делает результат! Но мы же с вами грамотные красавчики. И мы понимаем что волшебной таблетки не может быть! Но нам гуглпейдж спид кажить все эти FCP CLS и весь этот бред типа. Друзья. ни один модуль не решит ваши проблемы. Потому как вот эта вся модель оценки вашего ресурса, она очень сложная, ее сложно обмануть, она учитывает пользовательскую статистику хрома, кроме того что вам любые модули могут обмануть бота, и все это уже не актуально. И у вас там может быть сложнейшая верстка, куча лишнего контента, да все что угодно. Но ок, что же нам делать, у нас есть рабочий интернет-магазин. мы хотим подтянуть позиции по выдаче и стоим на распутье, хотим быстрый First contetn paintfull и отсутствие Cumulative Layout Shift. Наверное в формате магазина невозможно достичь идеальных показателей, но мы можем к ним попробовать постремиться. Итак, что я вам советую сделать, чтобы у вас улучшились показатели, без хамства авторов дешевых бесполезных поделок и при этом своими руками и легко: 1. Все изображения во всех модулях, списках, баннерах и так далее идут в Lazy, просто берете и делаете нативное Lazy https://developer.mozilla.org/ru/docs/Web/Performance/Lazy_loading Просто добавляете к изображениям свойство loading="lazy" 2. все изображения переводите в webp, для этого не надо бежать к сайткиратору и покупать платный модуль, просто пользуете это: 3. В большинстве шаблонов у нас по умолчанию в верстке list, который потом через js переводится в grid, сделайте grid в верстке по умолчанию и это отличн вам решит CLS показатель, так как у вас не будет сдвига макета при рендере, если не знаете что это и не знаете как сделать - долбите авторов шаблонов. 4. Новые хотелки page speed хотят, чтобы skeleton разметки страницы был сразу с установленными параметрами размеров изображений. Если у вас единый размер, задайте во всех выводах изображений width и height принудительно. 5. Используйте современные шаблоны. Да я верю, что вы все положили много денег и ресурсов в то что у вас есть, но или Криво косо, но содержат в себе какие-то built in механизмы отпимизации-сжатия скриптов стилей и дадут вам меньше запросов на вебсервер. Несмотря на кривость реализации, это лучше чем ничего! А еще шаблон от @29aleksey все таки прилично выглядит по сравнению со всеми остальными поделками за полтосик. Мне бы в 2012 году такой, для моих магазинов. Реально Леха-кравачик и душу вложил! 6. Если вам вот прямо необходим JivoChat, Вот вам отличный мануал, как решить с ним проблему; https://habr.com/ru/post/447262/ 7. Да я молчу про TTFB, который тоже влияет на оценку pagespeed, да я знаю как это сделать, да, я с удовольствием сделал бы бесплатную таблетку, которая решала проблему быстрой загрузки HTML контента, но это не возможно к сожалению, Минимум что я вам могу рекомендовать, едьте на быстрые хостинги, пользуйте пхп 7+, следите за включенным opcache. 8. Если у вас там метрики и аналитика от гугла - снести все в футер, это плохой совет, возможно вы лишитесь 3-5% каких то показателей, но зато внешние скрипты не затупят. 9. если у вас модуль доставки типа сдэка - посмотрите, чтобы он не пытался грузить яндекс карты на все страницы магазина. 10. Если вы пользуете метрику, отключите в ней вебвизор, вы им вряд ли будете пользоваться и смотреть в него, если нужен - никто не мешает включить! 11. Счетчики, аналитики и т.д. Ни в коем случае не делайте их подгрузку по пользовательскому событию или в отложенную загрузку. Уж если сильно вам мозолит глаза 10-15 баллов, которые они навешивают, снесите их в футер. 12. Вывод и скрытие контента в зависимости от типа устройства. Используйте с умом. Пользуйтесь не js библиотеками а mobiledetect, от того что вы спрячете в display none какой либо элемент, он все равно будет опубликован в DOM страницы, если что-то хотите убрать для мобильных устройств, просто не выводите этот контент фактически при генерации html кода! Но даже если вы реализуете большую часть моих советов, у вас будут отличные оценки pagespeed, и вас не придется выслушивать блевотный бред от авторов которые не смогли, или пытаются нажиться на трех строчках кода на ваших болях, как тот же ситикриатор со своим вебп компрессором, не замечая, что рядом есть отличные бесплатные решения! upd: ну и еще банальшина, но проверяйте настройки кеширования сжатия статики, и если у вас webp то и для него добавляйте правильные заголовки. К примеру, если у вас ISP то должно выглядеть так: Если у вас странные шаред хостинги или нестандартные панели сервером - гуглите, как настроить кеширование сжатие для статики - в зависимости от вашего веб-сервера. Опять же возвращаясь к ISP менеджеру, который заполонил все, попросите вашего вебмастера или саппорт хостинга проверить, чтобы nginx отдавал вот для этого всего правильные заголовки: location ~* ^.+\.(webp|jpg|jpeg|gif|png|svg|js|css|mp3|ogg|mpe?g|avi|zip|gz|bz2?|rar|flv|swf|woff2?|ico)$ { access_log off; expires max; break; } Вот прямо можете давать ссыль на статью и говорить - хочу вот так для вебп!
- 20 comments
-
- 24
-
Всем привет! Может кто сталкивался... Во многих современных шаблонах встроены модули, которые пережимают jpg, png и прочие форматы изображений в webp. На выходе мы и получаем фото в формате webp. Тут все понятно. Но у меня есть один нерадивый поставщик, который в фиде уже гонит фото в формате webp. Фото, соответственно, не загружаются. Как побороть, кто знает?
-
Version 1.25.0
306 downloads
Умная оптимизация изображений и конвертация в WebP на лету через OptiPic CDN. Что делает OptiPic CDN при попытке запросить у него изображение: Возвращает версию изображения WebP, если браузер поддерживает формат WebP. Возвращает сжатую / оптимизированную версию без webp, если браузер не поддерживает WebP. Делает изображение оптимизированным под мобильный экран, если изображение открывается с мобильного. Кеширует и ускоряет загрузку, снижая нагрузку с вашего хостинга. Преобразование в Webp и сжатие изображений происходит в фоновом режиме и не замедляет открытие изображений в браузере. Если оптимизированная версия еще не готова на момент запроса изображения, исходная версия возвращается без какой-либо обработки. Зачем нужна оптимизация изображений на сайте: Ускорение сайта. Улучшение SEO. Повышение конверсии. Повышение показателей Google Pagespeed Insights. Почему оптимизация изображений ускоряет работу вашего сайта? Бесплатная поддержка и помощь по установке Есть вопросы? Здесь вы можете получить бесплатную поддержку и бесплатную помощь в настройке модуля. Для получения дополнительной информации посетите официальный сайт OptiPic CDN. Видео-инструкция по настройке модуля в админке OpenCart: https://youtu.be/q4E2PGdF5JwFree- 3 reviews
-
- webp
- оптимизация изображений
- (and 7 more)
-
Скачать / Купить дополнение OptiPic оптимизация изображений и конвертация в WebP Умная оптимизация изображений и конвертация в WebP на лету через OptiPic CDN. Что делает OptiPic CDN при попытке запросить у него изображение: Возвращает версию изображения WebP, если браузер поддерживает формат WebP. Возвращает сжатую / оптимизированную версию без webp, если браузер не поддерживает WebP. Делает изображение оптимизированным под мобильный экран, если изображение открывается с мобильного. Кеширует и ускоряет загрузку, снижая нагрузку с вашего хостинга. Преобразование в Webp и сжатие изображений происходит в фоновом режиме и не замедляет открытие изображений в браузере. Если оптимизированная версия еще не готова на момент запроса изображения, исходная версия возвращается без какой-либо обработки. Зачем нужна оптимизация изображений на сайте: Ускорение сайта. Улучшение SEO. Повышение конверсии. Повышение показателей Google Pagespeed Insights. Почему оптимизация изображений ускоряет работу вашего сайта? Бесплатная поддержка и помощь по установке Есть вопросы? Здесь вы можете получить бесплатную поддержку и бесплатную помощь в настройке модуля. Для получения дополнительной информации посетите официальный сайт OptiPic CDN. Видео-инструкция по настройке модуля в админке OpenCart: https://youtu.be/q4E2PGdF5Jw Добавил optipic Добавлено 19.03.2021 Категория Кэширование, сжатие, ускорение Системные требования Метод активации Без активации Ioncube Loader Нет ocStore 3.0 2.3.0.2.4 2.3 2.2 2.1 OpenCart.Pro, ocShop Обращение к серверу разработчика Нет
-
- webp
- оптимизация изображений
- (and 7 more)
-
Заморочился в общем я на тему SEO и изображений в опенкарте. Сейчас по сути лишь одно работающее дополнение стоимостью около 3к о уважаемого разработчика может переделывать jpg в webp в зависимости от браузера. Я не претендую на открытие америке и буду рад любой критике, главное что бы мы смогли сделать конструктивную и работающую вещь на стороне сервера и вобще поняли как работать с изображениями. Есть такой Мурыч @demimurych на просторах интернета - недавно был его вебинар с Шакиным, он знает про изображения ну явно побольше 90% людей. Я лишь проводник инфы, для того что бы в опенкарте было удобнее этим пользоваться. Вот его вебинар. Вот тут файл со всеми настройками на сервере, который он любезно предоставил для конвертации webp на стороне сервера. Ну и самое главное, что в известном тут дополнении нельзя самому задавать размеры изображения, а сейчас стандарты для ПС очень сильно меняются. В общем смотрите вебинар, кто хочет вникнуть в суть. У меня лишь одно пожелание, тем кто побольше шарит, напишите плиз как должен выглядеть идеальный код изображения учитывая все эти src, src net, decoding и прочие атрибуты, потому как в вебинаре все кусками, а сложить воедино - я не на том левеле.
-
Оптимизация: modpagesepeed, imagecompressor, webp и оценка гугла
Yoda posted a blog entry in Прожектор Бритни Спирс
Здравствуйте дорогие мои читатели. Сегодня у нас на повестке оценка скорости работы сайта по данным PageSpeedInsight. За что я люблю гугл, за то что он дает постоянно работу разным шарлатанам. Им бы на завод впору пойти, или в сторожа. Но нет. Гугл выпускает очередную "супер важную муть" и на ней спешат наживаться всякого рода аферисты разных мастей. Ну не будем тыкать пальцами. Все итак знают, кто у нас умеет чудесно продавать одну строчку кода за 2000 рублей. Речь вобщем-то не об этом. А история у нас сегодня про https://www.modpagespeed.com/. Когда-то в 2013 году, когда я первый раз в жизни с двадцатого раза засетапил свой первый VPS, я пробовал ставить эту приблуду к апачу, что такое Nginx я тогда слыхом не слыхивал, а как его пересобрать и что такое ваще собрать ченить у меня не было ни малейшего понятия. Но годы проходят и седые волосы неумолимо приносят понимание. Как оказалось. Когда я пробовал modpagespeed эксплуатировать на своем первом сервере. Он был сырой, косячыный и сработал в очень ограниченном формате. Совершенно случайно, пару дней назад, в силу каких-то нелепых обстоятельств, я решил попробовать как это работает в нынешних реалиях. И о чудо!!! Эта штука автоматом, гонит все картинки в webp, там где надо, все это отлично открывается во всех бразуерах. Отличнейшим образом автоматом. Подчеркиваю.... Автоматом жмёт скрипты стили. Инлайнит это все дело там где можно... Ну и требует для установки времени совсем чуть чуть. Любой сисамин справиться. И при этом. У вас это все всерьез надолго... Без каких либо косяков на стороне файлов магазина. Без оплаты за "чудо-модули" не стоящие воздуха. И с кучей дополнительных плюшек, типа автоматического LazyLoad, асинхронного внедрения гугл-аналитики и гугл-шрифтов. И это все блиииин. Из коробки в один клик грубо говоря и работает... Друзья мои. Я вам крайне рекомендую посмотреть в эту сторону. Это реальный крутой ништяк. И в целом чаще гуглите профильную информацию. Оказывается нас всех некоторые персонажи держат за дураков и реально тупо парят пытаются впарить воздух! Да прибудет с вами сила!- 4 comments
-
- 3
-
- compressor
- webp
-
(and 3 more)
Tagged with:
-
Доброго времени суток! Опенкарт не хочет обрабатывать изображение в формате webp, их нет возможности загрузить через админку! После загрузки на vps через ftp всеравно не видет! В чем может быть проблема?
- 2 replies
-
- webp
- изображение в формате webp
-
(and 1 more)
Tagged with: