Оптимизация CSS

123 4
i.lisovenko
На сайте с 14.01.2022
Offline
41
588
Всем привет. У меня при строительстве сайтов частенько бывает такое, что что-то делаю быстро, вставляю контейнеры или присваиваю классы, чтоб сделать здесь и сейчас и увидеть результат. Но потом, со временем меняю структуру сайта ну и вообще меняю многое, удаляя например какие-либо контейнеры с классами и тд. Но как водится, из файла стилей естественно я это не убираю в тот момент (лишние классы).  Интересует такого рода вопрос: а есть ли какие-нибудь утилиты или онлайн-сервисы, ну или вообще что-либо, что может проанализировать сайт и файл стилей и написать типа, а вот этот класс не используется вообще, а вот этот тоже не используется, ну чтоб из файла стилей просто лишние классы убрать..?!
Сайт знакомств https://bluepink.life
Dmitriy_2014
На сайте с 01.07.2014
Offline
329
#1
В PageSpeed Insights от Google, все время мне предлагают Удалить неиспользуемый код CSS с Потенциальной экономией – 11 КиБ ссылаясь на мой основной style.css файл. Правда непонятно какой это неиспользуемый код, с чего они решили, что он неиспользуемый и почему насчитали 11 килобайт для меня загадка. А вообще у меня также, как и у вас, а еще я боюсь что-либо удалить т.к. оно может где-то использоваться.
i.lisovenko
На сайте с 14.01.2022
Offline
41
#2
Dmitriy_2014 #:
 А вообще у меня также, как и у вас, а еще я боюсь что-либо удалить т.к. оно может где-то использоваться.

Ну это я не из за Гугла скорей а из-за того что уже сам иногда путаюсь) или прописываю новый класс, а он уже оказывается был у меня

L
На сайте с 10.02.2015
Offline
236
#3

Какой размер css?

Сколько строк?

Это один файл или разбивка?

W1
На сайте с 22.01.2021
Offline
306
#4
Сложно всё это.
Мой форум - https://webinfo.guru –Там я всегда на связи
i.lisovenko
На сайте с 14.01.2022
Offline
41
#5
livetv #:

Какой размер css?

Сколько строк?

Это один файл или разбивка?

Файл один, строк около 1500, но там есть разделения под разные разрешения, размер файла 17.9кб

P
На сайте с 29.03.2024
Offline
8
#6

сделай массив классов

и пробеги по папке в поиске классов

и пусть выведет которые не нашлись, ну или удалит из css файла регуляркой

можно в чатгпт запросить php скриптосик)

Shelton724
На сайте с 26.05.2011
Offline
263
#7
i.lisovenko :
вот этот класс не используется вообще, а вот этот тоже не используется

Ну там такой момент, что на анализируемой странице не используется, а на следующей уже используется. Или может использоваться на анализируемой странице, но не в момент анализа, а в результате действия скриптов по каким-то событиям, тогда найти такое практически нереально автоматически. Если для каждой страницы отличающейся по потреблению стилей (да и мелких скриптов) использовать отдельные подключения - то тут (очевидно) только вред производительности, т.к. единый файл стилей сразу падает в браузер юзверя и висит один в кэше сервера обычно. Ну а для мелких используемых только на определенной  странице мелких стилей и скриптов их можно включить прямо в код страницы.

E
На сайте с 10.02.2024
Offline
10
#8

Делаю такое через gulp при сборке проекта.

Есть и онлайн версии.

Ему надо скормить файл стилей и html-страницу на входе.

На выходе CSS-файл без неиспользуемых в html стилей.

Примеры:

https://purifycss.online/

https://unused-css.com/

PurifyCSS Online - Remove unused CSS
PurifyCSS Online - Remove unused CSS
  • purifycss.online
Removes the unused code from your CSS and reduces the file size by up to 90%
Kaavain
На сайте с 28.07.2015
Offline
158
#9
i.lisovenko :
Всем привет. У меня при строительстве сайтов частенько бывает такое, что что-то делаю быстро, вставляю контейнеры или присваиваю классы, чтоб сделать здесь и сейчас и увидеть результат. Но потом, со временем меняю структуру сайта ну и вообще меняю многое, удаляя например какие-либо контейнеры с классами и тд. Но как водится, из файла стилей естественно я это не убираю в тот момент (лишние классы).  Интересует такого рода вопрос: а есть ли какие-нибудь утилиты или онлайн-сервисы, ну или вообще что-либо, что может проанализировать сайт и файл стилей и написать типа, а вот этот класс не используется вообще, а вот этот тоже не используется, ну чтоб из файла стилей просто лишние классы убрать..?!

Озадачивался этим вопросом. Ответ: НЕТ. 

Где-то гуляет обстоятельная статья с обоснованием почему только вручную. 

В теории можно написать скрипт, который будет брать класс из CSS и поиском по *.php искать вхождения. Я думаю такой налабать. 

Но онлайн - нет. 

Могу порекомендовать только хостинг: https://traf.at/vps - за 3 года все на 4++ и цены не подняли. Ну и банк для белых ИП: https://traf.at/bankm
W1
На сайте с 22.01.2021
Offline
306
#10
Kaavain #:
поиском по *.php искать вхождения

Не забудь ещё про участие в этом скриптов JS и про всякие плагины, стили которых могут переопределяться стилями сайта.

123 4

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий