Gzip против минификации

Вы правы.

Это не то же самое, что минимизировать, чем gzipping (их бы назвали одинаковыми, если бы это было так). Например, это не то же самое, что gzip:

var myIncrediblyLongNameForThisVariableThatDoesNothingButTakeUpSpace = null;

Чем minify, чтобы в итоге получить что-то вроде:

var a = null;

Конечно, я бы сказал, что лучший подход в большинстве случаев это минимизировать FIRST, а затем Gzip, чем просто минимизировать или gzipping, хотя в зависимости от кода иногда минимизация или gzipping даст вам лучшие результаты, чем выполнение обоих.

Будьте внимательны при тестировании этого: эти два фрагмента CSS тривиально малы, поэтому они не выигрывают от сжатия GZIP - добавление только небольшого заголовка GZIP приведет к потере полученной выгоды. В действительности у вас не было бы такого маленького CSS-файла, и вы бы беспокоились о его сжатии.

minify + gzip сжимает больше, чем просто gzip

Ответ на оригинальный вопрос: да, minify + gzip получит значительное количество больше сжатия, чем просто GZIP. Это верно для любого нетривиального примера (т. Е. Для любого полезного кода JS или CSS, длина которого превышает несколько сотен байтов).

Для примеров этого, захватите исходный код Jquery , который доступен сжатый и сжатый, сожмите их оба с помощью gzip и посмотрите.

Стоит отметить, что Javascript гораздо больше выигрывает от минимизации, чем хорошо оптимизированный CSS, но все же имеет преимущество.

Причина:

GZIP-сжатие без потерь. Это означает, что он должен хранить весь текст, включая точные пробелы, комментарии, длинные имена переменных и т. Д., Чтобы их можно было идеально воспроизвести позже. С другой стороны, минификация с потерями. Если вы минимизируете свой код, вы удаляете большую часть этой информации из своего кода, оставляя меньше, чем нужно GZIP для сохранения.

• Минификация удаляет ненужные пробелы, оставляя пробелы только там, где это необходимо по синтаксическим причинам.
• Минификация удаляет комментарии.
• Минификация кода может заменить имена идентификаторов более короткими именами, если не будет побочных эффектов.
• Минификация кода может сделать тривиальную «оптимизацию компилятора» к коду, который возможен только путем фактического разбора кода
• Минимизация CSS может устранить избыточные правила или объединить правила, имеющие один и тот же селектор.

Почему бы не использовать оба?

Это легко проверить: просто поместите текст вашего css в текстовые файлы и сожмите файлы с помощью архиватора, такого как gzip на linux.

Я только что сделал это, и бывает, что для первого CSS размер составляет 184 байта а для второго 162 байта.

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

Это просто из-за очень небольшого размера вашего примера, для больших файлов gzipping даст вам меньшие файлы.

Существует очень простой метод проверки: создайте файл, состоящий только из пробелов, и другой файл, который действительно пуст. Затем Gzip оба и сравните их размеры. Файл с пробелами в нем, конечно, будет больше.

это результаты, когда gziping два файла

bytes  File
45     min.txt
73     min.gz

72     normal.txt
81     normal.gz

конечно, вы можете проверить - запишите свой файл и скопируйте его с помощью zlib . Вы также можете попробовать воспользоваться утилитой "gzip".

Возвращаясь к вашему вопросу - нет определенной зависимости между длиной источника и сжатым результатом. Ключевым моментом является «энтропия» (насколько различны каждый элемент в источнике).

Таким образом, это зависит от того, каков ваш источник. например, множество непрерывных пространств (например,> 1000) может быть сжато так же, как и несколько (например, <10) пространств.

Конечно, «человеческое» сжатие с потерями, которое сохраняет макет или некоторые другие важные вещи и удаляет ненужный мусор (пробелы, комментарии, избыточные объекты и т. Д.) Будет лучше, чем сжатие без потерь gZip.

Например, такие вещи, как метки или имена функций, скорее всего, будут иметь определенную длину для описания значения. Замена его именами длиной один символ сэкономит много места и невозможна при сжатии без потерь.

Кстати, для CSS есть такие инструменты, как компрессор CSS , которые сделают работу с потерями за вас.

Тем не менее, вы получите лучшие результаты, сочетая «оптимизацию с потерями» и сжатие без потерь.

Вы правы, минимизируйте + gzip результаты в меньше байтов. Никаких научных доказательств.

Почему у вас нет метода тестирования?

Сократите код в одном файле и оставьте его «неуязвимым» в другом. Загрузите на веб-сервер, способный сжать выходные данные (например, mod_deflate для Apache), установить расширение Firebug для firefox, очистить кэш и получить доступ к обоим файлам. Вкладка «NET» Firebug будет содержать точное количество переданных данных, сравнить их, и у вас будет «эмпирическое» доказательство.

Вот результаты тест, который я провел некоторое время назад, используя "реальный" файл CSS с моего веб-сайта. Оптимизатор CSS используется для минификации. Стандартное архивное приложение Linux, поставляемое с Ubuntu, использовалось для Gzipping.

Исходный: 28,781 байт
Минимизировано: 22 242 байтов
Gzip: 6,969 байт
Min + Gzip: 5,990 байтов

Мое личное мнение - сначала использовать Gzip, поскольку это, очевидно, имеет самое большое значение. Что касается минификации, это зависит от того, как вы работаете. Вам нужно будет сохранить исходный файл CSS, чтобы вносить правки в дальнейшем. Если вам не мешает минимизировать его после каждого изменения, сделайте это.

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

Существует порог, при котором gzip-кодирование выгодно. Общее правило таково: чем больше файл, тем лучше сжатие, и gzip побеждает с большим отрывом. Конечно, вы можете сначала минифицировать, а затем сжимать gzip.

Но если мы говорим о gzip vs. minify на небольшом фрагменте текста длиной не более 100 байт, "объективное" сравнение ненадежно, даже бессмысленно - если только мы не разработаем базовый текст для создания стандартного средства сравнения, например, типа Lorem Ipsum, но написанный на Javascript или CSS.

Итак, позвольте мне предложить сравнить последние версии jQuery и MooTools (несжатые версии), используя мой Fat-Free Minify (PHP) код (простое удаление пробелов и комментариев, никакого сокращения переменных, никакого baseX-кодирования)

Вот результаты minify vs. gzip (при консервативном сжатии уровня 5) vs. minify+gzip:

MooTools-Core
-------------
Baseline 102,991 bytes
Minified 79,414 (77.1% of original)
Gzipped 27,406 (26.6%)
Minified+Gzipped 22,446 (21.8%)

jQuery
------
Baseline 170,095
Minified 99,735 (58.6% of original)
Gzipped 46,501 (27.3%)
Minified+Gzipped 27,938 (16.4%)

Прежде чем кто-то поспешит с выводами, это не битва JS библиотек.

Как вы можете видеть, минификация+gzip дает лучшее сжатие на больших файлах. Минификация кода имеет свои преимущества, но основным фактором является то, сколько пробельных символов и комментариев присутствует в исходном коде. В данном случае у jQuery их больше, поэтому он обеспечивает лучшую минификацию (гораздо больше пробельных символов во встроенной документации). Сила сжатия Gzip в том, сколько повторений в содержимом. Так что дело не в том, что minify vs. gzip. Они делают разные вещи. И вы получаете лучшее из обоих миров, используя оба.