it-swarm.com.ru

Gzip против minify

На днях у меня было несколько оживленное обсуждение минимизации Javascript и CSS по сравнению с кем-то, кто предпочитает использовать Gzip.

Я позвоню этому человеку X.

X сказал, что Gzip уже минимизирует код, поскольку он архивирует ваши файлы.

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

У меня нет метода тестирования, но я считаю, что Gzip этого кода:

.a1 {
    background-color:#FFFFFF;
    padding: 40px 40px 40px 40px;
}

Будет по-прежнему больше, чем Gzip этого кода:

.a1{body:background-color:#FFF;padding:40px}

Есть ли кто-нибудь, кто может доказать это правильно или неправильно.
И, пожалуйста, не говорите: "Это правильно, потому что я всегда этим пользовался".

Я прошу научных доказательств здесь.

128
KdgDev

Очень просто проверить. Я взял ваши js, поместил их в разные файлы и запустил gzip -9 на них. Вот результат. Это было сделано на машине WinXP с Cygwin и gzip 1.3.12.

-rwx------  1 xxxxxxxx mkgroup-l-d     88 Apr 30 09:17 expanded.js.gz

-rwx------  1 xxxxxxxx mkgroup-l-d     81 Apr 30 09:18 minified.js.gz

Вот еще один тест с использованием реального примера JS. Исходный файл "common.js". Оригинальный размер файла 73134 байта. Сокращено до 26232 байтов.

Оригинальный файл:

-rwxrwxrwx 1 xxxxxxxx mkgroup-l-d 73134 Apr 13 11:41 common.js

Сокращенный файл:

-rwxr-xr-x 1 xxxxxxxx mkgroup-l-d 26232 Apr 30 10:39 common-min.js

Исходный файл упакован с опцией -9 (та же версия, что и выше):

-rwxrwxrwx 1 xxxxxxxx mkgroup-l-d 12402 Apr 13 11:41 common.js.gz

минимизированный файл, сжатый с опцией -9 (та же версия, что и выше):

-rwxr-xr-x 1 xxxxxxxx mkgroup-l-d  5608 Apr 30 10:39 common-min.js.gz

Как видите, между разными методами есть определенная разница. Лучше всего как минимизировать, так и сжать их.

188
Paul Kuykendall

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

Оригинал: 28 781 байт
Сокращено: 22 242 байтов
Gzipped: 6 969 байтов
Min + Gzip: 5 990 байтов

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

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

27
DisgruntledGoat

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

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

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

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

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

Обоснование:

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

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

Ты прав.

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

var myIncrediblyLongNameForThisVariableThatDoesNothingButTakeUpSpace = null;

Чем минимизировать, чтобы закончить с чем-то вроде:

var a = null;

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

11
Seb

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

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

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

Вот результаты minify против gzip (при консервативном сжатии уровня 5) против 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.

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

6
bcosca

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

5
Robert

Я не видел, чтобы кто-то упоминал Манглинга, поэтому я публикую свои результаты по этому вопросу.

Вот некоторые цифры, которые я придумал, используя UflifyJS для минификации и Gzip. У меня было около 20 файлов, которые я объединил вместе примерно в 2,5 МБ с комментариями и все.

Конкат файлы 2,5 МБ

uglify({
    mangle: false
})

Сокращенный без искажения: 929kb

uglify({
    mangle: true
})

Сокращенный и искалеченный: 617 КБ

Теперь, если я возьму эти файлы и скопирую их, я получу 239 КБ и 190 КБ соответственно.

1
Mike

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

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

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

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

1
madewulf

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

0
B.E.

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

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

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

Однако вы получите наилучшие результаты, сочетая "оптимизацию с потерями" и сжатие без потерь.

0
schnaader

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

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

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

0
Francis

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

bytes  File
45     min.txt
73     min.gz

72     normal.txt
81     normal.gz
0
John Boker