CSSMinMax – скрипт для обработки файлов формата CSS (таблиц стилей) в текстовом редакторе Notepad++. Выполняет двунаправленную конверсию файла, минифицирует несжатые или, наоборот, форматирует минифицированные файлы. Направление преобразования определяется автоматически по результатам экспресс‑анализа содержимого текущего файла. Предназначен для быстрой и качественной конверсии "сырого" файла стилей в сжатый вид. Предоставляется по лицензии GPL v.3, бесплатно для частного некоммерческого использования.
В этой статье:
CSSMinMax – скрипт на языке Python, компрессор/форматтер CSS‑файлов, дополнение 2-в-1 к текстовому редактору Notepad++. Преобразует CSS любой сложности и объёма, параметры обработки устанавливаются автоматически, могут быть изменены в настройках под текущие потребности пользователя.
Основное назначение – обеспечить быструю конвертацию открытого CSS‑файла (или выделенного фрагмента) в сжатый формат (минификация, компрессия) или, наоборот, привести сжатое содержимое файла в читабельный вид (построчное форматирование по отдельным правилам и директивам, создаётся удобная для работы "ёлочка" правил и директив). Главная цель – дать разработчику стилей быстрый и удобный оффлайновый инструмент конверсии, обеспечить простоту и компактность решения.
Встроенный набор дополнительных полезных функций для расширенной обработки исходного текста, коррекции типовых ошибок и оптимизации отдельных видов правил позволяет достаточно гибко регулировать структуру и размер создаваемого файла стилей в зависимости от его назначения.
Толчком к началу разработки этого аддона стала работа по изменению и усовершенствованию текущего дизайна сайтов Проекта Good CRX. Командой нашего Проекта был проанализирован ряд онлайновых и оффлайновых инструментов для минификации (сжатия) файлов стилей, однако при этом не было найдено достаточно простого и удобного решения, дающего возможность оперативной обработки объёмных и сложных таблиц стилей в "товарных количествах".
Тем не менее, исходя из используемых нами инструментов разработки, были определены общие требования к приложению, решающему задачу быстрой и качественной минификации произвольного числа файлов стилей, основным из которых стало требования оффлайновой обработки непосредственно в текстовом редакторе. Вторым по значимости стало требование к максимальной степени компрессии выходных файлов, которые в дальнейшем размещаются на наших сайтах (меньший размер даёт, соответственно, повышение скорости загрузки и обработки стилей). Также "желательным" стало требование к проверке и (возможной) автокоррекции некоторых типовых ошибок (или простых "очепяток") прямо на этапе создания файлов стилей, без необходимости их тестирования в веб‑среде.
В итоге для "допиливания" под наши задачи и требования был выбран скрипт‑компрессор CSSmin на языке Python, написанный непосредственно под текстовый редактор Notepad++, на основе которого и был сделан форк с доработкой* большей части функций и добавлением дополнительных операций конверсии и проверки/коррекции некоторых типовых ошибок. При разработке форка ставилась задача сохранения простоты кода, универсально работающего в любых версиях редактора Notepad++, а также задача объединения в "одном флаконе" компрессора и форматтера CSS‑файлов (обычно это реализуется в виде отдельных дополнений, работающих только "в одну сторону"). Кроме того, функционал прототипа существенно расширен за счёт изменения логики обработки и добавления гибкости путём дополнительных настроек.
* Проект прототипа не развивается с 2012 года, его код содержит ряд устаревших на сегодняшний день правил обработки. В целом, форк является прямым "наследником" базовых функций прототипа, однако, за счёт добавления расширенных возможностей, он вынесен в отдельный проект и размещён на сайте "Рабочей Зоны" как один из инструментов, направленных на создание удобной и комфортной рабочей среды для разработчиков и профессиональных дизайнеров стилей.
В результате сделанных изменений получился простой и компактный аддон с расширенным управлением под различные задачи разработчиков CSS. Скрипт может служить отличной альтернативой большинству онлайновых сервисов, упрощая и ускоряя работу с отладкой стилей перед запуском их в эксплуатацию на веб‑ресурсах. Также этот скрипт может применяться разработчиками браузерных расширений, исследователями и дизайнерами, стремящимися получить качественный исходный код, соответствующий современным стандартам.
При выпуске первой версии в августе 2024 года новый скрипт был "брэндирован" как "CSSMinR24", что отразило набор дополнительных полезных функций и общую ориентированность форка на текущие стандарты веб‑дизайна. Кроме того, "R24" указывает и на связь с рабочим названием нового дизайна наших сайтов, в рамках работы над которым прототип был переделан. В дальнейшем, после добавления функции форматирования, название изменено на "CSSMinMaxR24" и на текущий момент аддон распространяется под этой "торговой маркой".
Следует особо отметить, что в отличие от многих других современных аддонов (и, тем более, от большинства онлайновых сервисов конверсии), в CSSMinMax нет (и никогда не будет) никакой "допустимой" или скрытой рекламы, это приложение не является предметом монетизации.
Автор гарантирует отсутствие в этом приложении различных следящих, "стучащих" и иных "статистических" механизмов, а также любых других средств, направленных на "персонализацию" конечного пользователя с целью получения какой‑то коммерческой выгоды.
CSSMinMax предназначен для обработки файлов формата CSS (таблиц стилей) в текстовом редакторе Notepad++. Выполняет двунаправленную конверсию файла, минифицирует несжатые или, наоборот, форматирует минифицированные файлы. Направление преобразования определяется автоматически по результатам экспресс‑анализа содержимого текущего файла. Скрипт предназначен для быстрой и качественной конверсии "сырого" файла стилей в сжатый вид. Также может использоваться разработчиками стилей для комфортного анализа сторонних сжатых файлов, при конверсии которых обеспечивается многоуровневое форматирование в виде аккуратной "ёлочки" вложенных правил и директив.
Скрипт обеспечивает два основных режима работы: "по месту" (при этом обрабатывается и автоматически заменяется выделенный фрагмент текста текущего файла стилей) и обработка всего файла целиком с автосохранением результата в новый файл. Скрипт имеет достаточно развитую систему настроек, позволяющих оперативно менять условия конверсии и способы обработки, может использоваться для автокоррекции некоторых типовых ошибок и для оптимизации CSS путём преобразования цветов, размеров и медиа‑правил в сокращённый вид.
Для удобства пользователя все операции с файлами выполняются полностью автоматически (согласно заданным вами настройкам) и не требуют дополнительного ручного ввода каких‑либо параметров. Настройки по умолчанию основаны на практическом опыте работы со стилями и оптимальны в большинстве случаев. При желании вы можете в любой момент изменить любой параметр настроек под текущие потребности, также доступна быстрая обработка большого числа файлов с идентичными настройками.
В качестве языка встроенного описания и интерфейса вывода сообщений используется английский (жёстко зашит в коде). Это связано с упрощением кода и с тем, что подавляющее большинство разработчиков стилей в достаточной мере владеет "басурманским" (использование этого скрипта, конечно же, подразумевает определённый "профессиональный уклон"). Какая‑либо иная локализация в скрипте отсутствует и в обозримом будущем не планируется.
CSSMinMax написан на языке Python и применяет структуру функций и операндов, работающих в линейках Python 2.x (или новее). Кроме того, в скрипте используется API встроенных команд редактора Notepad++ для создания и сохранения файлов, а также для работы с другими внутренними функциями редактора.
Исходя из сказанного, для применения скрипта необходимо установить в ваш редактор плагин Python Script, его текущую версию можно скачать здесь (там же указаны ссылки на авторскую документацию по установке, настройке и применению плагина). Этот плагин обеспечивает локальную среду выполнения Python‑скриптов в редакторе Notepad++ и их корректную "стыковку" с внутренними командами редактора.
Текущая версия CSSMinMax может быть использована не только для непосредственной обработки CSS‑файлов, но и для сжатия скриптов на языке JavaScript. Для задействования этой возможности необходимо установить в ваш редактор плагин JSTool, его текущую версию можно скачать здесь (там же указаны ссылки на авторскую документацию по установке, настройке и применению плагина). Этот плагин обеспечивает корректное сжатие любых JS‑файлов в редакторе Notepad++ и "стыковку" с внутренними командами редактора (автосохранение в новый файл под соответствующим именем).
Если планируется достаточно частое применение скрипта, для ускорения вызова (без поэтапного прохождения пунктов меню) можно вывести на панель инструментов отдельную кнопку для него. Это можно сделать либо с помощью настроек плагина Python Script, либо с помощью специализированного* плагина настройки тулбара редактора. Во втором случае потребуется установить в ваш редактор плагин Customize Toolbar, его текущую версию можно скачать здесь (там же указаны ссылки на документацию по установке и настройке плагина). Для лучшего визуального восприятия также можно использовать отдельную иконку для этой кнопки (файл CSSMinMaxR24.bmp, поставляется в комплекте со скриптом).
* Рекомендуется этот способ, как более гибкий с т.з. возможности произвольного изменения расположения кнопок на панели инструментов. Кнопка для скрипта создаётся путём добавления записи в специальный файл конфигурации, находящийся по пути ..\plugins\Config\CustomizeToolbar.btn (кодировка UTF‑16).
Строка для кнопки в русскоязычной версии редактора может быть задана так:
Плагины,Python Script,Scripts,CSSMinMaxR24,CSSMinMaxR24.bmp
Результат выглядит примерно так:
Полезный совет: по аналогии вы можете создать кнопки для нескольких копий "минимаксера" с разными "типовыми" настройками. Варианты копирования и настроек ограничиваются только вашими потребностями. Такое "размножение кнопок" может существенно ускорить вашу работу, если вам приходится часто сжимать множество CSS‑файлов под различные условия применения.
Как отмечено выше, CSSMinMax имеет дополнительные настройки, определяющие способы преобразования отдельных элементов таблиц стилей и непосредственно влияющие на конечный результат. Также одной из важных настроек является обработка комментариев в CSS‑файле, это могут быть как текстовые комментарии разработчика, так и неиспользуемые (или временно отключённые) директивы и правила.
Все доступные настройки сведены в отдельную переменную set (блок настроек, содержит вложенные переменные в виде "ключ":"значение"), которая может быть отредактирована вами в любой момент в соответствии с вашими конкретными задачами для правильной обработки ваших стилей.
Для изменения отдельных ключей (параметров конверсии) следует открыть файл скрипта в редакторе (можно в том же окне, что и обрабатываемые файлы), внести нужные вам изменения в блоке переменных set и затем сохранить файл скрипта. Сделанные изменения будут применены сразу же, при первом же вызове скрипта после его редактирования (перезапуск редактора не требуется, настройки считываются каждый раз при запуске скрипта).
Для удобства пользователя в блоке настроек имеются комментарии (на английском языке), кратко поясняющие действие каждого из ключей и возможные варианты обработки в зависимости от установленных значений параметров.
Подробнее о назначении каждого из ключей настроек и допустимых значениях этих опций можно прочитать в статье CSSMinMax : Настройка и применение. Там же указаны значения параметров по умолчанию и описано взаимовлияние настроек друг на друга.
Будьте предельно внимательны при редактировании параметров скрипта, некорректно заданные опции могут не только дать непредсказуемый результат конверсии, но и привести к зависанию как самого скрипта, так и управляющего плагина "Python Script" и/или редактора в целом!
Для лучшего понимания, как работает каждый из ключей настроек, перед применением скрипта "в боевых условиях" вы можете "потренироваться на кошках" – в комплект поставки скрипта входит тестовый CSS‑файл (CSSMinMaxR24_test.css), содержащий примеры различных видов правил, директив и медиа‑условий (в том числе и многоуровневые, для изучения работы форматтера).
В этом файле также содержатся "неправильные" директивы, с ошибками и "опечатками", которые предназначены для наглядного изучения работы автоматической коррекции ошибок в зависимости от различных настроек.
После установки скрипта и настройки управляющего плагина "Python Script", CSSMinMax готов к работе. Запуск конверсии текущего открытого в редакторе файла стилей осуществляется либо через меню плагина (выбор пункта "CSSMinMaxR24", сооответствующего "минимаксеру"), либо (что быстрее и удобнее) через кнопку на панели инструментов редактора.
Если в текущем файле выделена какая‑либо часть текста, она будет проанализирована на предмет направления конверсии (сжатие или форматирование), преобразована в соответствии с настройками и затем заменена на результат конверсии.
Если в текущем файле нет выделенного фрагмента текста, будет проанализирован файл целиком, весь текст будет преобразован в соответствии с настройками, затем будет создан новый пустой файл, в который будет вставлен результат конверсии. Этот файл также будет автоматически сохранён (при любых настройках) с именем, автоматически созданным на основе имени исходного файла с добавкой маркера конверсии. Вновь созданный файл сохраняется в той же папке, в которой находится исходный CSS‑файл (по тому же пути).
Если текущий файл НЕ имеет имени (например, вновь созданный и ещё не сохранённый файл стиля), будет выдан запрос на указание имени файла. Такой же запрос выводится, если расширение файла отличается от .css.
Если текущий файл (или выделенный фрагмент) НЕ является стилем (определяется автоматически), будет выдано сообщение об ошибке.
Если текущий файл является JS‑файлом (определяется по его расширению) И если у вас в настройках "минимаксера" указан соответствующий флаг, будет сделана попытка вызова плагина "JSTool". Если плагин отсутствует в вашем редакторе, будет выдано сообщение об ошибке. Если плагин корректно* установлен, результат обработки (сжатие текущего файла и копирование результата в новый файл) будет автоматически сохранён в той же папке, что и исходный скрипт, под другим именем, сгенерированном на основе имени исходного JS‑файла с добавкой, определённой вами в настройках.
* Фактически, вся работа "минимаксера" в этом случае сводится к передаче текущего файла на обработку плагину JSTool и автосохранению результатов этой обработки в новом файле. Этот "костыль" сделан исключительно для удобства разработчиков, так как текущая версия JSTool "не умеет" автоматически делать такие простые операции, как скомбинировать выходное имя файла и сохранить его.
Во всех случаях возникновения указанных выше ошибок, работа "минимаксера" аварийно завершается без выполнения каких‑либо действий (кроме записи об "аварии" в консоли плагина "Python Script"). Это нормально (это "не баг, а фича")), такое упрощение сделано специально, поскольку обработка исключений и корректный выход из скрипта приводят в этих случаях к неоправданному распуханию кода.
В общем и целом – разработка "CSSMinMax" будет поддерживаться и развиваться, есть некоторые задумки на предмет дополнительных функций, повышающих комфорт работы с аддоном.
Несмотря на достаточное число "конкурентов" этого приложения, задачи минификации и форматирования исходников весьма интересны автору, а необходимость в подобных инструментах была, есть и будет. Поэтому, в любом случае, этот проект будет жить и дальше, потребность в улучшении функциональности приложения и упрощении его применения конечными пользователями (и самим автором)) остаётся даже после внесения всевозможных усовершенствований, ведь никогда не будет найдено нечто "идеальное раз и навсегда"… :)
Основной полезный функционал в какой‑то степени уже реализован. В дальнейшем, возможно, что-то будет сделано в плане совершенствования уже имеющихся возможностей, приведения в соответствие с самыми новыми веб‑стандартами или добавления новых функций (например, для пакетной обработки файлов), часть функций будет "заимствована" из других скриптов в рамках этого же приложения.
Есть и другие, понятные автору, направления развития функционала, но на текущий момент не хотелось бы "раскрывать все карты", пусть эти фичи останутся моей "маленькой коммерческой тайной", которая обязательно будет реализовываться и публиковаться в будущем.)
Желающие лично поучаствовать в развитии этого проекта могут обсудить имеющиеся и предложить какие‑то другие полезные и нужные функции непосредственно в комментариях к этой* статье. Автором приветствуется конструктивная критика с "креативным фидбэком", на основе которых можно будет решать различные (возможные)) "нестыковки" или дополнять функционал "Минимаксера" в соответствии с "пожеланиями трудящихся".)
* Создание отдельной статьи по фичам, по аналогии с другими авторскими аддонами, на текущий момент не планируется. Если в дальнейшем такая необходимость возникнет, ссылки на подобные материалы будут опубликованы в этом подразделе. В общем, "следите за новостями" и периодически проверяйте обновления этой статьи. Если, конечно, вам интересна вся эта тематика..:)
CSSMinMax не имеет практических ограничений по версии редактора Notepad++, гарантируется работоспособность любой из версий скрипта на Notepad++ v.6.5.1 (и новее) со всеми плагинами, указанными в материале статьи. Скрипт может применяться под любыми операционными системами семейства Windows, начиная от Windows XP и выше.
Можно загрузить любую из версий CSSMinMax на следующих ресурсах:
Настоятельно рекомендуется использовать текущую стабильную версию скрипта. Более ранние выпуски можно устанавливать только в исследовательских целях для сравнительного анализа функций и возможностей аддона. Авторская поддержка предыдущих версий не осуществляется, претензии по возможным проблемам их эксплуатации не рассматриваются.
Для работы CSS-конвертера требуется наличие в вашем редакторе установленного плагина "Python Script".
После установки и первоначальной настройки указанного плагина нужно выполнить следующие действия: (указаны стандартные наименование пунктов меню и путей размещения плагина и скриптов)
* Указано название пункта в русской версии редактора. В английской версии этот пункт называется "Plugins".
** При этом будет обрабатываться либо выделенный фрагмент в текущем файле текущего активного окна редактора (конверсия с заменой выделенного текста "по месту"), либо весь текущий файл целиком (если ничего не выделено, результат работы скрипта будет помещён и автоматически сохранён в новом файле).
*** Кроме различных видов правил (в т.ч. многоуровневых, пустых и с вложенными комментариями), этот файл содержит некоторые типовые ошибки и "опечатки" для демонстрации возможностей работы автокоррекции кода.
Также можно установить и настроить дополнительные плагины редактора для повышения удобства работы.
Во избежание сложностей с установкой и эксплуатацией внимательно читайте документацию. Это относится не только к документации на сам скрипт, но и к документации по тем плагинам редактора, которые используются для его работы.
Кроме того, не стесняйтесь задавать вопросы, если у вас что‑то "ну вот совсем никак не получается", пишите комментарии, будем разбираться что и почему "не едет", автор открыт для обсуждения.
