Главная > CSS/Style Sheets > uncss: поиск неиспользуемого CSS-кода
uncss: поиск неиспользуемого CSS-кода3 июня 2014, 12:00. Разместил: Design FactoRy |
Вам известно, что с перспективы разработки кода гораздо лучше, чем добавление дополнительных свойств на сайт или в приложение? Удаление ненужного барахла! Будь то код, изображения или дополнительные библиотеки, удаление ненужных фрагментов кода – это как первый глоток вина после длительного рабочего дня. Можно испытать очень приятные ощущения, когда прогоняешь папку с картинками через ImageOptim, не правда ли? А что, если такой же инструмент существовал бы и для неиспользуемого CSS? И он существует. Называется этот инструмент uncss – утилита на базе NodeJS. Давайте взглянем на то, как работает uncss. Основное применение инструмента с командной строкой uncss, будет заключаться в следующем:
Результатом данной операции будет таблица стилей, включающая в себя только используемые CSS-правила, - все неиспользуемые правила будут удалены. Так как же работает uncss? Позвольте нам рассказать вам? * HTML-файлы загружаются посредством PhantomJS и затем происходит выполнение javascript. * Используемые таблицы стилей извлекаются из полученного HTML-файла. * Таблицы стилей соединяются, а правила парсятся посредством css-parse. * document.querySelector фильтрирует селекторы, которые не были найдены в HTML-файлах. * Оставшиеся правила конвертируются обратно в CSS. Как и с любой другой утилитой на NodeJS, вы сможете извлечь преимущество из javascript API. Давайте рассмотрим процесс использования на примере:
Вряд ли можно спорить с тем, что несколько лет работы веб-сайта, его поддержки и видоизменений могут привести к тому, что в коде будет слишком много лишнего. За весь этот лишний код приходится расплачиваться вашим пользователям, которые подолгу ждут загрузки страниц, поэтому очень важно от него избавиться. Обязательно попробуйте uncss – им очень просто пользоваться, а автоматизированный помощник сохранит ваш код максимально привлекательным и оптимизированным! Вернуться назад |