Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Структурная минификация шортхендов #101

Open
kizu opened this issue Oct 24, 2012 · 1 comment
Open

Структурная минификация шортхендов #101

kizu opened this issue Oct 24, 2012 · 1 comment

Comments

@kizu
Copy link

kizu commented Oct 24, 2012

Про шортхенды уже было, но не уверен, что было такое (чем-то похоже на #58, но точно безопасно). Скажем, есть вот такой CSS:

.some_class_a{font:10px/1.5 Helvetica,Arial,sans-serif}
.some_class_b{font:12px/1.5 Helvetica,Arial,sans-serif}
.some_class_c{font:14px/1.5 Helvetica,Arial,sans-serif}
.some_class_d{font:16px/1.5 Helvetica,Arial,sans-serif}

В нём записи почти одинаковые, различается только часть без font-family. Если вынести часть с font-family вот так:

.some_class_a{font:10px/1.5 a}
.some_class_b{font:12px/1.5 a}
.some_class_c{font:14px/1.5 a}
.some_class_d{font:16px/1.5 a}
.some_class_a,.some_class_b,.some_class_c,.some_class_d{
    font-family: Helvetica,Arial,sans-serif;
}

То подобная запись будет уже заметно короче. Т.е. иногда в шортхендах могут быть длинные повторяющиеся последовательности, которые можно минимизировать.

Тут важно, что в данном случае нужно в оригинальном шортхенде оставлять какой-то font-family, в данном случае a — без него запись не сработает, но т.к. дальше оно всё-равно переопределяется, то что там будет — совершенно не важно, главное, чтобы коротко.

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

@fliptheweb
Copy link

Неплохо было бы еще оптимизировать названия шрифтов перед этим, чтобы csso смог однозначно сравнить.
К примеру -

  1. Удалить кавычки, если в названии шрифта не используется пробел или спецсимволы (в спецификации написано "To avoid mistakes in escaping, it is recommended to quote font family names that contain white space, digits, or punctuation characters other than hyphen" http://www.w3.org/TR/CSS2/fonts.html#font-family-prop)
  2. Удалить пробелы между названиями шрифтов

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants