Ускоряем Opencart 2.0

Тема в разделе "Инструкции и FAQ", создана пользователем Slait, 26 авг 2015.

  1. Slait

    Slait Эксперт

    Сообщения:
    503
    Симпатии:
    452
    1. Отключить подсчет товаров

    Делается это просто Админка – Настройки – Ваш интернет магазин – Опции – Кол-во товаров в категории

    speed-01.png

    2. Gzip
    Проверяем если у Вас gzip http://checkgzipcompression.com/.
    speed-04.png

    Включаем Gzip Админка – Настройки – Ваш интернет магазин – Сервер – Уроверь сжатия – 7. Я использую 7 из 9. Вы можете выбрать любой уровень сжятия от 0 до 9.

    speed-03.png




    3. URL Cache
    Ставим SEO PRO или CompliteSEO, Paladin. Основная задача создать Кеш для URL. На примере SEOPROсоздается файл

    speed-02.png

    4. CRON
    Ищем решение для cron. Если есть возможность добавьте в cron генерацию выгрузки YML (Yandex market). Что это даст. При формировании файла грузится вся система, после создания файла, yandex берет только файл и больше ничего, сервер не грузится. Аналогичная ситуация с картой сайта. Это умеет модуль Paladin.

    5. Сжатие картинок.
    Перед запуском проекта советую пережать все картинки, как это сделать: Скачиваете к себе на компьютер всю папку /image/catalog/ скачиваете программу FileOptimizer

    http://nikkhokkho.sourceforge.net/static.php?page=FileOptimizer. Перетаскиваете всю папку в окно программы (ВНИМАНИЕ программа записывает сжатую версию файлов поверх) и жмем кнопку “Optimize all files”. Jpeg жмет быстро, png дольше. Сжатые файлы закачиваем на сервер.

    speed-06.png

    Как альтернатива используйте программу RIOT (Radical Image Optimization Tool).

    Далее

    Уменьшаем качество картинок до 80%. По умолчанию качество картинок 90%, меняется это просто.

    System/library/image.php

    38 строка
    Код:
    public function save($file, $quality = 90) {
    Меняем значение 90 на 80, сохраняем файл, чистим папке кеша /image/cache/

    speed-05.png

    6. Добавляем кеширование на стороне клиента

    Открываем .htaccessи добавляем блок.

    Код:
    <IfModule mod_expires.c>
    ExpiresActive On
    ExpiresByType image/jpg "access 1 year"
    ExpiresByType image/jpeg "access 1 year"
    ExpiresByType image/gif "access 1 year"
    ExpiresByType image/png "access 1 year"
    ExpiresByType text/css "access 1 month"
    ExpiresByType text/html "access 1 month"
    ExpiresByType application/pdf "access 1 month"
    ExpiresByType text/x-javascript "access 1 month"
    ExpiresByType application/x-shockwave-flash "access 1 month"
    ExpiresByType image/x-icon "access 1 year"
    ExpiresDefault "access 1 month"
    </IfModule>
    Что это даст, даст информацию для браузера, что не нужно качать постоянно файлы с сервера, а брать их из кеша самого браузера.

    7. Сжатие файлов JS и CSS.
    Используя сервис gtmetrix.com сжимаем файлы.
    speed-07.png
    Если есть возможность объединяем файлы. Ваша задача уменьшить время открытия страницы. Страница должна открываться меньше чем 5 секунд. Идеал 1-4 секунды. Постарайтесь выполнить все требования системы.

    8. Уменьшаем код HTML
    Устанавливаем модификацию http://forum.opencart-russia.ru/threads/umenshaem-kod-html.2106/ после установки сокращается размер HTML

    9. Включаем кэширование сайта
    Для включения кэширования советую любой модуль, из платных Super Page Cache (http://codecanyon.net/item/opencart-super-page-cache-site-speed-booster/7522552) из бесплатных V2pagecache (http://forum.opencart-russia.ru/thr...uskorenie-opencart-2-0-russkaja-versija.1490/)
    Разницы в них особой нет, поэтому ставьте любой.

    10. Переходим на WebP
    Меняем картинки на новый формат WebP (Плагин для работы в Photoshop). Качаем WebP_v0.5b5_win.zip добавляем в программу (По умолчанию это папка с программой и папка Plug-ins). У меня папка "c:\Program Files\Adobe\Adobe Photoshop CC 2015\Plug-ins\"
    После жмем сохранить и выбираем эти настройки (Без потери качества)
    2016-01-25 09-50-21 Скриншот экрана.png

    В итоге вы получите выигрыш примерно в 30-50% (все зависит от изображения). Для мелких картинок иногда не получается выиграть в размере, поэтому экспериментируем и ищем оптимальный вариант.

    2016-01-25 09-52-27 Скриншот экрана.png

    Далее добавляем файлы на сайт и радуемся меньшему размеру страницы.

    2016-01-25 10-10-06 Скриншот экрана.png

    2016-01-25 10-11-34 Скриншот экрана.png

    P.S. Если у Вас есть проекты которые нужно ускорить пишите в личку
     

    Вложения:

    Последнее редактирование: 25 янв 2016
    cyberkekc, grey0207, Bkmz и 5 другим нравится это.
  2. Ален

    Ален Эксперт

    Сообщения:
    2.052
    Симпатии:
    631
    Для пункта 3 указывайте точные данные. Кеширование запросов к url_alias не дает большого прироста скорости по умолчанию.
    Напоминаю, что установка сеопро, просто так для галочки приводится к нарушении совместимости с различными модулями. (типа блога, новости итд итп)

    Для ускорения можно еще использовать http://www.opencart.com/index.php?r...extension_id=19079&filter_username=budgetneon
    Лично не пробовал, в код не вникал.

    А для проверки всех этих сжатий итд можно использовать https://developers.google.com/speed/pagespeed/insights/
    При выборе нормального хостинга типа www.beget.ru все сжатия итд работают по умолчанию без настроек.
     
    Zlata Jesen, Romans, plat75 и ещё 1-му нравится это.
  3. Nika777

    Nika777 Новичок

    Сообщения:
    5
    Симпатии:
    2
  4. Slait

    Slait Эксперт

    Сообщения:
    503
    Симпатии:
    452
  5. Slait

    Slait Эксперт

    Сообщения:
    503
    Симпатии:
    452
    Добавил информацию по уменьшению HTML кода в шапку.
     
    grey0207 нравится это.
  6. grey0207

    grey0207 Активный пользователь

    Сообщения:
    126
    Симпатии:
    33
    По поводу пункта сжатия картинок.
    Я сжимал с помощью FileOptimizer порядка 5000 картинок (jpg) своего каталога. Примерно 5% картинок с разных независимых категорий у меня залило синим/полупрозрачным слоем почему-то (почему так - не пойму). В итоге использовал как альтернативу: RIOT (Radical Image Optimization Tool).
     
    Slait нравится это.
  7. Slait

    Slait Эксперт

    Сообщения:
    503
    Симпатии:
    452
    Добавил информацию о формате WebP (сжатие по методу Google). Пункт 10.
     
    grey0207 нравится это.
  8. grey0207

    grey0207 Активный пользователь

    Сообщения:
    126
    Симпатии:
    33
    Это выходит как альтернатива пункту 5 про сжатие картинок только с форматом webp?
     
  9. Slait

    Slait Эксперт

    Сообщения:
    503
    Симпатии:
    452
    Да, но пока не получится заменить все, так как сжатие данного формата не реализовано в движке.
    Подойдет для графики темы и баннеров.
     
  10. clevergod

    clevergod Новичок

    Сообщения:
    6
    Симпатии:
    1
    Можете насчет 7. Сжатие файлов JS и CSS. пояснить подробнее, что бы я из всех пунктов не делал, проблема у меня на этом сайте на этом пункте.
    upload_2016-2-8_1-10-11.png
     

    Вложения:

  11. solunski.d

    solunski.d Эксперт

    Сообщения:
    1.570
    Симпатии:
    428
    GTMetrix предлагает посмотреть оптимизированную версию файлов и ее и можно скачать.
     
    Slait нравится это.
  12. clevergod

    clevergod Новичок

    Сообщения:
    6
    Симпатии:
    1
    Как обыватель отвечаю, кто новичок, тем может поможет.
    Не смог на GTMetrix найти оптимизированные версии файлов, кроме картинок.
    Сделал проще, на гугл PageSpeed Insights в самом низу есть оптимизированные версии всех файлов которые ему не нравятся, архив (java|jpg|css).
    Ужасно что все не в том порядке каталогов что внутри структуры движка, но выше по описанию проблем можно найти ссылки к не нравящимся файлам гугла.
    Предостерегаю таких как я, не опытных, Меняем картинки можно все сразу, а вот с некоторыми аплетами явы и css могут возникнуть проблемы (оптимизированные файлы это ничто иное как отрубание лишнего с фала для уменьшения веса файла), менять по одному предварительно сделав бакап. По крайней мере у меня на нестандартной теме были проблемы.
    Забыл отметить, что после замены чистим кеш и обновляем модификаторы модулей, после чего страницу и если все хорошо продолжаем.
     
  13. grey0207

    grey0207 Активный пользователь

    Сообщения:
    126
    Симпатии:
    33
    Вот скрин, где указано что можно скачать оптимизированные версии JS и CSS в GTMetrix: http://snag.gy/IKmdv.jpg ;)
     
  14. clevergod

    clevergod Новичок

    Сообщения:
    6
    Симпатии:
    1
    Спасибо, понял. Просто все так мелко, что с первого раза не разберешь.
    Все равно хостера менять буду, кеш у него не работает на nginx и не хочет включать, да и эхо запросы оставляют желать лучшего.
    Остальные настройки сделаны и немного поднялись цифры.

    Кто может подсказать, как для обывателя что означают эти пукты:
    Specify image dimensions(F0) - Вот это что такое?
    Leverage browser caching(F20) - это понятно что кеш браузера, но в htaccess я его включил. Как выяснилось хостер гонит.
    Combine images using CSS sprites(А35) - это как я понял нужна склейка всех картинкок в одну в фотошопе.
     
  15. grey0207

    grey0207 Активный пользователь

    Сообщения:
    126
    Симпатии:
    33
    Дай ссылку на результат в GTMetrix, посмотрю что там и как. Сам сейчас этим и занимаюсь :)
     
    clevergod нравится это.
  16. clevergod

    clevergod Новичок

    Сообщения:
    6
    Симпатии:
    1
    Вот
     
  17. clevergod

    clevergod Новичок

    Сообщения:
    6
    Симпатии:
    1
    Дико извиняюсь что не в тему, но не нашел в категориях.
    Как решить проблему с переходом по вкладкам после включения HTTPS в настройках и htaccess?
    Проблема в том, что после конца домена / и перед началом ссылки система добавляет /..// и соответственно сайт пишет страница не найдена.
    Пока не так много номенклатуры набил, поэтому прошу совета у спецов.
    Отключал SeoPro в настройках, не помогает.
    Opencart_cms 2.1.0.2
     
  18. lenurfm

    lenurfm Новичок

    Сообщения:
    3
    Симпатии:
    0
    Подскажите пожалуйста, Google PageSpeed Insights просит: Удалите из верхней части страницы код JavaScript и CSS, блокирующий отображение,
    это что и как нужно сделать?
     
  19. solunski.d

    solunski.d Эксперт

    Сообщения:
    1.570
    Симпатии:
    428
    Это значит что нужно попросить программиста, скомпилировать все css файлы в один. А js файлы перекинуть в низ сайта перед закрывающим тегом body и по большой части скомпилировать в один. Если вы не программист, значит вы вряд ли сделаете, скомпилировать css файлы я думаю сможет, тот кто ищет.
     
  20. Ravilr

    Ravilr Специалист

    Сообщения:
    3.111
    Симпатии:
    863
    и сломать работу модулей. Если бы было все так просто, то все скрипты по умолчанию выводили бы именно там.
     
    optimlab нравится это.