Какие-нибудь рекомендации для CSS-миниатора? [закрыто]
289
Какие-нибудь рекомендации для CSS-миниатора?
Я буду бродить вокруг Google и пробовать кое-что, но я подозревал, что умное, опытное и любопытно красивое сообщество StackOverflow, возможно, уже оценило плюсы и минусы тяжеловесов.
+1 только для понимания «меняющейся природы» вещей вокруг, а также понимания и объяснения причин для закрытия подобных вопросов - даже если это ваше! ;)
Эндрю Барбер
Ответы:
98
YUI Compressor является фантастическим. Работает на JavaScript и CSS. Проверьте это.
@ JuniorMayhé Я использовал его, и мои стили полностью испортились, хотя я проверил «Только минимизировать, без запутывания символов». вариант) ... к сожалению, каждый минификатор, который я пробую, всегда нарушает мой стиль. Это потому, что онлайн-минифайеры - это все дерьмо? Так не должно быть.
диалект
1
@DiAlex Я понимаю, что многие из них портят наш код, мы должны использовать их осторожно, всегда выбирая «консервативный» подход, а не агрессивный ре-факторинг. Консерватор будет удалять только ненужные пробелы, конечные точки с запятой, повторяющиеся стили и так далее. Я думаю, что эти минифайеры могут легко повредить стиль, если мы используем некоторые CSS-хаки внутри CSS-кода. Обратная косая черта и странные символы могут свести компрессор с ума.
Младший Mayhé
Вы можете попробовать онлайн сервис zbugs.com - он использует компрессор yui для минимизации ваших файлов.
Я немного запутался. YUI Compressor устарела в пользу UglifyJS ( демо ). Имеет ли смысл работать с портом .NET?
Мартин Всетичка,
Приятель. Я начал этот порт в 2008 году или около того. Это 6 с лишним лет назад. Я также опубликовал этот ответ в '09. Поэтому, пожалуйста, проверьте даты и определите контекст, прежде чем задавать глупые вопросы. Теперь выйдите на улицу и
поиграйте
Pure.Krome: прошу отличаться. Я посмотрел репозиторий GitHub, и ему уже несколько месяцев, и коммиты этого года. Вот почему я спросил. "Приятель".
Мартин Всетичка,
: slow clap: хорошо заметили! ты на самом деле прав - о. Подождите. Я запустил проект на codeplex: yuicompressor.codeplex.com . Первый коммит 7 июля 2008 г. ( yuicompressor.codeplex.com/SourceControl/changeset/… ). Затем переехал в GH в этом году . Я не делал никакой работы по его переносу в течение длительного времени. Здесь и там было только несколько странных исправлений ошибок. Так. Чувак. Я портирую ED это. Не портирую это. Это в режиме обслуживания. QED
Pure.Krome
1
Вы тоже :) И приветствует ссылку на UglifyJS - это было то, что я хотел проверить, чтобы узнать, сможем ли мы использовать его на работе - и вы только что напомнили нам об этом! ура :)
Pure.Krome
19
Мне нравится Minify . На PHP и работает с CSS или JavaScript.
+1 для минификации. Если вы уже знакомы с PHP, вам может быть удобнее установить его. Требуется PHP5. После того, как вы его настроите, вы можете забыть об этом, работать как обычно с любым количеством супер CSS-файлов и js-файлов с супер-пробелами и комментариями, как вы захотите, и minify сожмет их на лету.
Махали
13
CSSO в настоящее время лучший минификатор / оптимизатор.
Просто попробуйте, и вы найдете, что это лучшее. На данный момент нет аналогов для его техники минификации, насколько я знаю.
молчалив
1
хорошо, я сравнил CSSO с YUI Compressor в 30 КБ тестовом файле, и после сжатия сжатого вывода обоих инструментов CSSO выигрывает, сжимая файл на дополнительные 7 байтов. Конечно, это всего лишь один тестовый файл.
Если вы используете Python, я бы порекомендовал стройнее который, вероятно, не так быстр, как YUI Compressor, но в отличие от csscompressor.net он не подавляет CSS-хаки.
Я пристрастен с тех пор, как написал «стройнее», и сейчас я оцениваю YUI Compressor, чтобы увидеть, как он справляется со взломами. Пример стройнее в действии можно увидеть, если посмотреть источник crosstips.org
Я хотел бы проголосовать против этого ответа (уже слишком поздно после того, как я проголосовал за него). Я пытаюсь сжать мой CSS, и это ломает вещи. Это совсем не хорошо. Предупреждение всем там, я думаю, что, если у вас нет первоклассных css стандартов, это может сломать ваше дерьмо!
BT
19
Но разве у вас не должно быть чистого, соответствующего стандартам CSS?
Чак Ле Батт
2
если вы используете шаблон HTML5, нет.
SkaveRat
Хороший инструмент. Я тестировал его, html{width:100%;height:100%;} body{width:100%;height:100%;padding:0;} #test{padding:1em;width:10em;} #test{padding:2em;}и он работал лучше, чем YUI Compressor (который не устранял дубликаты для заполнения # test). Тем не менее, оба не смогли удовлетворить меня html,body{width:100%;height:100%}body{padding:0}(что, в моем понимании, эквивалентно, так как оба селектора имеют одинаковую специфичность).
drdaeman
CSS - это единственное, где иногда допускаются дрянные хаки. Некоторые из этих хаков используют странные трюки с комментариями, которые могут сломать минимизацию.
Приятный вариант. Один запрос: вы сказали: «Согласно спецификации CSS, поддерживаются два типа строк: одинарные и двойные. Мой алгоритм оставляет строку нетронутой, даже если в ней есть пробельные символы ... Я просто думаю, что сохранение строки без изменений более интуитивно и профессионально ». Конечно, любые пробелы, которые не добавляют значения, должны быть удалены, чтобы сделать выходной файл как можно меньше? Разве это не точка минификации?
Пол Д. Уэйт
3
Ну, на мой взгляд, это верно в общем случае. Но я считаю строки особенным случаем. Разработчик оригинального CSS должен решать, удалять ли из строки бессмысленные пробелы. Алгоритм, который я показываю, просто следует спецификации, сохраняя строку без изменений.
Fat Free Framework - GPL, и поэтому я предполагаю, что эта часть их кода тоже. Просто на голову.
CodeReaper
У него есть ошибки: плохая идея.
Brunoais
3
Я считаю, что CSS SuperScrub от isnoop работает очень хорошо. Он может обрабатывать только прямые ссылки на CSS онлайн, хотя: / Вы можете обойти это, хотя, используя предпочитаемый сервис pastebin для хранения кода CSS и просто предоставив SuperScrub необработанную ссылку.
Я попробовал это, #test { padding: 1em; width: 10em; } #test { padding: 2em; }и это не удалось.
drdaeman
@drdaeman Это, вероятно, потому что он не знает, что делать с конфликтующими / дублирующимися значениями для данного селектора. Поскольку я не поддерживаю SuperScrub, я не могу сказать вам, когда или если это будет исправлено.
Джон Мишель
3
Если ваш сайт находится в ASP.NET, вы можете позволить своему сайту минимизировать CSS на лету (так что вам не придется делать это вручную каждый раз, когда вы вносите изменения). Например с этим:
Другие упоминали YUI Compressor, затем его .NET-порт, и я добавлю еще одну ссылку в цепочку. StyleManager - это серверный элемент управления, который объединяет порт .NET YUI Compressor, так что вы можете использовать его так же, как вы привыкли использовать ScriptManager. Он также добавляет кучу других приятных функций, таких как константы CSS, разрешение тильды (~) в ваших определениях фоновых изображений и т. Д. И т. Д. Он плотный, хорошо документированный, и я использовал его во всех своих последних проектах с о проблема. Проверьте это - gStyleManager.com
Все еще "в бета-версии", но должно работать довольно хорошо. Я использую код, стоящий за ним в каждом проекте: http://claudiu.phpfogapp.com/ Он построен на PHP, а также хранит ваш файл * .css в течение достаточно большого промежутка времени, несомненно, достаточно, чтобы позволить вам протестировать свой код с помощью минимизированный css. (Я удалил бы только старые css-файлы, если на сервере слишком много места).
Существует проект codeplex, который подключается к веб-сайтам .net, который минимизирует и сжимает файлы CSS и JS. Существует также сравнение между Microsoft AJAX Minifier и YUI Compressor, которое показывает, что YUI выходит немного лучше. Существует дополнительная вариация, которая сочетает в себе Microsoft Minifier и сжатие, которые резко сократили файл.
Конечно, хотя я не думаю, что есть много минифайеров, для запуска которых требуется более одного клика.
Пол Д. Уэйт
Вы правы, Пол :), но этот делает намного больше, чем просто минимизирует, и все в один клик
Тамик Созиев
1
Ознакомьтесь с последней версией HTML5BoilerPlate Пола Айриша - она содержит скрипт сборки для минимизации всех ваших ресурсов (включая PNG и JPG). Вы можете посмотреть демо-видео здесь .
Ответы:
YUI Compressor является фантастическим. Работает на JavaScript и CSS. Проверьте это.
источник
Также есть порт .NET YUI Compressor, который позволяет: -
ОБНОВЛЕНИЕ 2011: И теперь это доступно через NuGet также :)
источник
Мне нравится Minify . На PHP и работает с CSS или JavaScript.
источник
CSSO в настоящее время лучший минификатор / оптимизатор.
источник
Если вы используете Python, я бы порекомендовал стройнее который, вероятно, не так быстр, как YUI Compressor, но в отличие от csscompressor.net он не подавляет CSS-хаки.
Я пристрастен с тех пор, как написал «стройнее», и сейчас я оцениваю YUI Compressor, чтобы увидеть, как он справляется со взломами. Пример стройнее в действии можно увидеть, если посмотреть источник crosstips.org
источник
Проверьте CSSTidy: http://csstidy.sourceforge.net/usage.php
И в Интернете по адресу: http://cdburnerxp.se/cssparse/css_optimiser.php
источник
Если вы ищете онлайн-инструмент, попробуйте это: https://csscompressor.net/
источник
html{width:100%;height:100%;} body{width:100%;height:100%;padding:0;} #test{padding:1em;width:10em;} #test{padding:2em;}
и он работал лучше, чем YUI Compressor (который не устранял дубликаты для заполнения # test). Тем не менее, оба не смогли удовлетворить меняhtml,body{width:100%;height:100%}body{padding:0}
(что, в моем понимании, эквивалентно, так как оба селектора имеют одинаковую специфичность).Я написал ультра быстрый CSS Minifier в C #. Алгоритм не обрабатывает Javascript, хотя. Вот это: http://www.ko-sw.com/Blog/post/An-Ultra-Fast-CSS-Minify-Algorithm.aspx .
источник
Попробуйте закрывающие таблицы стилей .
Помимо минификации, он также поддерживает линтинг , переключение RTL и переименование классов .
Он также может добавлять переменные , функции , условные выражения и миксины в CSS.
Также обратите внимание, что некоторые из этих функций зависят от остальных инструментов закрытия (которые сами по себе очень мощные).
источник
Если вы ищете что-то в PHP, вот ссылка: -
Обезжиренный Minify
Хотя он является частью PHP Fat-Free Framework, он также может использоваться автономно.
источник
Я считаю, что CSS SuperScrub от isnoop работает очень хорошо. Он может обрабатывать только прямые ссылки на CSS онлайн, хотя: / Вы можете обойти это, хотя, используя предпочитаемый сервис pastebin для хранения кода CSS и просто предоставив SuperScrub необработанную ссылку.
источник
#test { padding: 1em; width: 10em; } #test { padding: 2em; }
и это не удалось.Если ваш сайт находится в ASP.NET, вы можете позволить своему сайту минимизировать CSS на лету (так что вам не придется делать это вручную каждый раз, когда вы вносите изменения). Например с этим:
http://www.codeproject.com/KB/aspnet/CombineAndMinify.aspx
источник
В Perl есть CSS :: Minifier (и версия XS для дополнительной скорости).
источник
Другие упоминали YUI Compressor, затем его .NET-порт, и я добавлю еще одну ссылку в цепочку. StyleManager - это серверный элемент управления, который объединяет порт .NET YUI Compressor, так что вы можете использовать его так же, как вы привыкли использовать ScriptManager. Он также добавляет кучу других приятных функций, таких как константы CSS, разрешение тильды (~) в ваших определениях фоновых изображений и т. Д. И т. Д. Он плотный, хорошо документированный, и я использовал его во всех своих последних проектах с о проблема. Проверьте это - gStyleManager.com
источник
Все еще "в бета-версии", но должно работать довольно хорошо. Я использую код, стоящий за ним в каждом проекте: http://claudiu.phpfogapp.com/ Он построен на PHP, а также хранит ваш файл * .css в течение достаточно большого промежутка времени, несомненно, достаточно, чтобы позволить вам протестировать свой код с помощью минимизированный css. (Я удалил бы только старые css-файлы, если на сервере слишком много места).
источник
Существует проект codeplex, который подключается к веб-сайтам .net, который минимизирует и сжимает файлы CSS и JS. Существует также сравнение между Microsoft AJAX Minifier и YUI Compressor, которое показывает, что YUI выходит немного лучше. Существует дополнительная вариация, которая сочетает в себе Microsoft Minifier и сжатие, которые резко сократили файл.
В любом случае ссылка является http://xpedite.codeplex.com/wikipage?title=Minifier%20(CSS%2FJavaScript%20Minification%20Handlers )
источник
Вот как я это сделал для MVC3: http://mkramar.blogspot.com/2011/08/css-and-javascript-minify-and-combine.html Прелесть этого подхода в том, что он делает все на лету и вам не нужно предварительно обрабатывать файлы вручную или настраивать пост-сборку.
источник
Онлайновый инструмент (намного лучше, чем www.csscompressor.net, который подхватил мой css): http://www.cssdrive.com/compressor/compress.php отлично справляется со своей работой.
источник
Пример C #:
источник
Zbugs.com будет хорошим онлайн-инструментом для вас, он уменьшит ваши CSS в один клик
источник
Ознакомьтесь с последней версией HTML5BoilerPlate Пола Айриша - она содержит скрипт сборки для минимизации всех ваших ресурсов (включая PNG и JPG). Вы можете посмотреть демо-видео здесь .
источник