Минификация: переименование/сокращение селекторов CSS?

Я искал инструменты, которые минимизируют HTML, CSS и JS вместе. При этом я имею в виду не только удаление пробелов и комментариев, но и сокращение селекторов.

Например

<div class="wrapper">
    <div class="sub-header"></div>
</div>

к:

<div class="eD"><div class="qw"></div></div>

Но так и не нашел. И это как бы подтверждается тем, что просмотр фактов с популярных сайтов, таких как GitHub, Reddit и даже Facebook, показывает полные имена классов, такие как «основной контейнер» и т. д.

Так есть ли инструмент, который делает то, что я хочу?

У вас должен быть единый набор инструментов, которые могут быть лучшими в своем классе для минимизации HTML, CSS и JS. И часть JS будет немного сложной, потому что, если имена классов когда-либо создаются с помощью строковых операций, было бы нетривиально убедиться, что вы получили их без каких-либо ложных срабатываний. Кроме того, в большинстве случаев фактическое использование пропускной способности страницы определяется несколькими изображениями, а не исходным HTML-кодом страницы.
Существует также потенциальная проблема с читабельностью. Если (в худшем случае) мы столкнемся с ситуацией, когда единственная существующая копия вашего кода — развернутая, и вы намеренно исказили ее, с ней будет довольно сложно работать. С другой стороны, я думаю, что это может обеспечить некоторую (очень) небольшую запутанность.
Если ваши процессы разработки теряют основную копию, и все, что у вас остается, — это развернутая версия, у вас есть гораздо более серьезные проблемы, чем веб-страница, которую трудно понять. Люди все время использовали развернутый объектный код и каким-то образом умудрялись (обычно) цепляться за исходный код.

Ответы (1)

Если вы все еще ищете инструмент, который обрабатывает эти вещи. Существует проект под названием «rename-css-selectors», если вы обрабатываете код с помощью узла:

https://www.npmjs.com/package/rename-css-селекторы

Для него также есть Gruntplugin:

https://www.npmjs.com/package/grunt-rcs

Это уменьшит все селекторы CSS в файлах HTML, JS и CSS (фактически любой файл, который вы хотите). В конце я сохранил 20% размера файла CSS. Скоро будет выпущен Gulpplugin.

РЕДАКТИРОВАТЬ:

Ответ выше - только половина. Чтобы полностью ответить на ваш вопрос, вы можете комбинировать различные инструменты. В дополнение к этому rename css selectorsвы можете использовать минификатор HTML из kangax. При этом вы экономите 30% на файлах HTML:

https://github.com/kangax/html-минифер

Для него также есть Gruntplugin:

https://github.com/gruntjs/grunt-contrib-htmlмин

Или даже глотнуть:

https://www.npmjs.com/package/gulp-htmlmin

Таким образом, нет инструмента, который бы справился со всем за один раз. Но комбинирование различных инструментов/пакетов сделает это за вас.

Минификация: переименование/сокращение селекторов CSS?
СпросиСетьПолитика конфиденциальности1y, 0v