Методы упаковки JavaScript

При загрузке JavaScript‑кода обычно предполагается, что чем меньше загружаемый файл, тем быстрее он загрузится. Это несколько не соответствует действительности, что прекрасно подтверждает дальнейшее изучение ситуации. Мы рассмотрим скорость загрузки библиотеки jQuery в трех формах: обычной, уменьшенной (при помощи YUI Compressor) и упакованной (используется Packer). Если упорядочить их по размерам, то будет примерно так: самый маленький вариант – естественно, упакованный, – затем уменьшенный, затем нормальный.

Однако упакованная версия добавляет некоторые накладные расходы: ее нужно сначала распаковать (выполнять достаточно тяжелый eval и replace) с помощью того же JavaScript на стороне клиента. Эта распаковка может занять достаточно продолжительное время при загрузке страницы. То есть использование уменьшенной версии, в конце концов, будет значительно быстрее, чем упакованной – даже при достаточно большом размере файла. Ниже приводится сравнение времени загрузки различных вариантов уменьшения jQuery.

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

Вариант

Среднее время

Уменьшенный

519.7214

Упакованный

591.6636

Нормальный

645.4818

Таблица 2. 1.Время загрузки библиотеки jQuery , которая была подвергнута различным уменьшениям

Очевидно, что при использовании любой техники сжатия стоит помнить о такой формуле:

Время_загрузки = Время_на_скачивание + Время_на_исполнение

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

Подводя итог всем вышеприведенным выкладкам, можно сделать следующее заключение. Если использовать gzip‑сжатие для текстовых файлов, то наилучшим выбором будет применение YUI Compressor для дополнительной минимизации CSS‑ и JavaScript‑файлов. Результирующий файл будет в среднем самым маленьким из возможных вариантов сжатия и будет загружаться в браузере максимально быстро.

Производительность загрузки JavaScript‑библиотек

Из этого исследования можно еще получить данные по влиянию производительности различных JavaScript‑библиотек на загрузку страницы. Таким образом, более простая и меньшая по размеру библиотека будет загружаться быстрее аналогов. По результатам видно, что jQuery загружается достаточно быстро относительно других библиотек (200–400 мс – существенный выигрыш в скорости). Ниже приведено среднее время загрузки неархивированных и неуменьшенных версий библиотек не из кэша.