Автор Тема: Оптимизация сайта для ускорения!  (Прочитано 156 раз)

19 Июнь 2018, 19:02:44
  • Старожил
  • ****
  • Сообщений: 282
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Друзья, я перешел к этапу Оптимизации.
Для ускорения сайта.
Я еще не настраивал сервер и не включал кеширование.

Не знаю правильно ли я это делаю, но тем не менее, сюда буду писать про этапы и достижения.

Пожалуйста поддержите советом, поделитесь опытом)


PS 1.6.1.17
РЕГ.ру
vip-3 хостинг

да, у меня VPS)))
19 Июнь 2018, 19:07:05
Ответ #1
  • Старожил
  • ****
  • Сообщений: 282
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
1-ый этап "Оптимизация CSS"
(может я не с того начал, поправьте меня плиз...)


1) Удалил с помощью notepad++ все
font-family: шрифт;

и в globale.css написал
* {
   text-decoration: none!important;
   font-family: 'Open Sans', sans-serif!important;
   font-weight: 300;
}

2) Определил заголовки

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {

   font-weight: 400;
}

h1, .h1 {
   font-size: 30px;
}

h2, .h2 {
   font-size: 26px;
}

h3, .h3 {
   font-size: 24px;
}

h4, .h {
   font-size: 22px;
}

h5, .h5 {
   font-size: 20px;
}

h6, .h6 {
   font-size: 18px;
}
19 Июнь 2018, 19:23:16
Ответ #2
  • Старожил
  • ****
  • Сообщений: 282
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
попробовал оптимизировать css с помощью https://www.cy-pr.com/tools/css/

Но ошибка

проверяю на валидность https://validator.w3.org

есть ошибки http://prntscr.com/jwt2tj


ееееееее исправил! http://prntscr.com/jwt4jk

проверяю снова, снова ошибка((( http://prntscr.com/jwt5b7
19 Июнь 2018, 19:31:50
Ответ #3
  • Ветеран
  • *****
  • Сообщений: 21410
  • Репутация: +25286/-1
  • Prestashop - просто и эффективно
    • Просмотр профиля
Через день проверьте. Некоторые сервисы кешируют результаты анализа и обновляют через время.
Эксперт Prestashop - решения всех проблем, написание модулей, создание тем для интернет-магазинов под Prestashop.
Эксперт Magento - создам сайт на Magento, программирование кастомных модулей для Magento, кастомизация тем Magento.
Лучшие цены!!!
19 Июнь 2018, 19:32:52
Ответ #4
  • Ветеран
  • *****
  • Сообщений: 21410
  • Репутация: +25286/-1
  • Prestashop - просто и эффективно
    • Просмотр профиля
Проверять нужно с включенным кешированием. При исправлении ошибок отключать.
Эксперт Prestashop - решения всех проблем, написание модулей, создание тем для интернет-магазинов под Prestashop.
Эксперт Magento - создам сайт на Magento, программирование кастомных модулей для Magento, кастомизация тем Magento.
Лучшие цены!!!
19 Июнь 2018, 19:37:39
Ответ #5
  • Старожил
  • ****
  • Сообщений: 282
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Проверять нужно с включенным кешированием. При исправлении ошибок отключать.

я на скорость не тестил еще сайт, просто начал оптимизацию кода с css
все равно придется..

потестил в https://developers.google.com/speed/pagespeed/insights

60/61

  http://prntscr.com/jwt9f6
19 Июнь 2018, 19:42:20
Ответ #6
  • Ветеран
  • *****
  • Сообщений: 15039
  • Репутация: +14588/-5
  • Сообщество PrestaShop
    • Просмотр профиля
С prestashop 1.6 70-80 набрать в pagespeed уже хорошо.
В версии 1.7 можно больше.
Начинать нужно с оптимизации темы, это правильно.
19 Июнь 2018, 19:54:56
Ответ #7
  • Старожил
  • ****
  • Сообщений: 282
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
С prestashop 1.6 70-80 набрать в pagespeed уже хорошо.
В версии 1.7 можно больше.
Начинать нужно с оптимизации темы, это правильно.

точно, забыл сказать, что у меня PS 1.6.1.17

попробовал на более маленьком css и о чудо заработал py-pr.com

файл уменьшен с 74кб до 52кб
Интересно полетело ли оформление?)))


А вот cleancss наоборот увеличил размер css c 74к до 79к
как так то?
19 Июнь 2018, 20:11:49
Ответ #8
  • Старожил
  • ****
  • Сообщений: 282
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
вооо еще нашел хороший ресурс http://www.css-school.ru/optimiser/
ооочень быстрый pr-cy использует его...
но оригинал быстрее
посмотрим что будет.

План такой: я проверяю все css темы на валидность. затем проганяю чере оптимизатор. Оцениваю результат по внешнему виду, полетело ли оформление. потом замер скорости.
http://prntscr.com/jwtnjl
19 Июнь 2018, 20:24:10
Ответ #9
  • Старожил
  • ****
  • Сообщений: 282
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Проверять нужно с включенным кешированием. При исправлении ошибок отключать.

Стоит ли мне объединять все css в один большоййй css ???
19 Июнь 2018, 20:26:54
Ответ #10
  • Старожил
  • ****
  • Сообщений: 282
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
identity.css
пустой !!! в bootstrpae тоже....

зачем это?
может удалить? и как это сделать?
19 Июнь 2018, 20:48:24
Ответ #11
  • Старожил
  • ****
  • Сообщений: 282
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
проверил на валидность, кое где были недочеты, но впринципе все очень чисто... читал что это бальзам на душу девелоперу и не более, хм на сколько вообще существенно проверять все это на валидаторе?

и да, вот это не ошибка, но валидатор ругается, может кто сталкиавался?
Свойство “pointer-events” не существует : none
19 Июнь 2018, 20:56:24
Ответ #12
  • Старожил
  • ****
  • Сообщений: 282
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
input[type="button" i]:focus,
input[type="checkbox" i]:focus,
input[type="file" i]:focus,
input[type="hidden" i]:focus,
input[type="image" i]:focus,
input[type="radio" i]:focus,
input[type="reset" i]:focus,
input[type="submit" i]:focus,
input[type="file" i]:focus::-webkit-file-upload-button {
    outline-offset: 0px; outline: none;
}



Что этоооо?
19 Июнь 2018, 21:18:33
Ответ #13
  • Старожил
  • ****
  • Сообщений: 282
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
после использования http://www.css-school.ru/optimiser/

полетела вся верста (((((
http://prntscr.com/jwuhlv


правда и скорость загрузки увеличилась немного с 61/62 до 65/62
http://prntscr.com/jwui42

Вывод: оптимизация css дает эффект, нужно только сделать это аккуратно!
19 Июнь 2018, 22:04:29
Ответ #14
  • Ветеран
  • *****
  • Сообщений: 15039
  • Репутация: +14588/-5
  • Сообщество PrestaShop
    • Просмотр профиля
Для престы есть модуль Cache Manager.
С ним можно улучшить скорость.