Сжатие Javascript кода - JavaScript Minify Compression

Сжатие файлов Javascript Minify (JavaScript Compression Tool) — это простой в использовании онлайн-компрессор JavaScript, инструмент для минимизации кода на JS. Он позволяет сжимать и уменьшать все ваши JS-файлы до 40% от их исходного размера. Скопируйте, вставьте и уменьшите ваш JS скрипт.

Онлайн сжатие кода JavaScript

• Сжимает JS код путем удаления пробелов, комментарий, переносов строки и других не нужных сииволов;
• Онлайн инструмент позволяет загружать URL-адрес Javascript для минимизации;
• Пользователи также могут минимизировать файл JS, загрузив его;
• Минификация Minify JS Online хорошо работает на Windows, MAC, Linux, Chrome, Firefox, Edge и Safari.

Для чего нужно сжимать JavaScript?

• Более быстрое время загрузки для ваших пользователей;
• Снижение потребления полосы пропускания (трафика) вашего сайта;
• Уменьшено количество HTTP-запросов на вашем сервере при объединении множества файлов JavaScript в один сжатый файл, что снижает нагрузку на веб-сервер;
• Сжатие Javascript для оптимизации Google PageSpeed Insights.

Принцип сжатия кода JS файлов

Аргументы функции

Поскольку аргументы функции должны быть как можно более короткими, и скорее всего будут использованы по несколько раз во время выполнения, их лучше именовать в алфавитном порядке, так как осмысленные имена очень длинные:

Использование in для проверки наличия аргумента:

Переменные

«Лишние» аргументы вместо var

Можно сэкономить байты указав лишний аргумент в функции, вместо объявления переменной с помощью var:

Используйте переменные по несколько раз

Используйте присваивание там, где это возможно

Поскольку оператор присваивания возвращает присваиваемое значение, можно использовать присваивание и проверку одновременно:

Используйте массив чтобы поменять местами переменные

Массив можно использовать как временное хранилище, чтобы не объявлять лишнюю переменную:

Используйте приведение типов при сложении

Циклы

Для экономии на теле цикла используйте for вместо while

for и while обычно занимают одинаково количество байт, но for позволяет получить больший контроль и больше возможностей для присваивания:

Используйте быструю итерацию по «правдивым» массивам

Если у вас есть массив, все члены которого заведомо приводятся к true, можно использовать более короткую запись цикла:

Используйте for..in с присваиванием для получения ключей объектов:

Операторы

Эти знания могут помочь неплохо сэкономить на скобках.

Используйте ~ c indexOf

Используйте запятую для последовательного выполнения операторов вместо блока:

Используйте более короткие способы записи undefined

Вместо undefined можно использовать []._ или void 0.

Есть варианты ""._, 1.._ и [][0], но они намного медленнее.

Иногда пробелы после операторов можно безболезненно удалить:

Числа

Используйте ~~ или 0| вместо Math.floor

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

Используйте побитовые сдвиги для больших бинарных чисел:

Используйте 1/0 вместо Infinity

Это короче. Кроме того, делить на нуль всегда весело:

Используйте «ложность» нуля

Вместо сравнивания чисел иногда короче свести значение к нулю и проверить его истинность:

В сочетании с унарным минусом это дает возможность, например, инкрементировать любую, даже еще не определенную переменную:

Строки

Можно сэкономить два байта при разбиении строк методом split, если в качестве разделителя использовать нуль:

Используйте браузерный метод link

Строки в браузерах имеют не очень известный метод link, который создает html-ссылку:

Используйте методы replace и exec для итерации по строкам

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

Примеры использования: templates и UUID.

Используйте массивы для создания простых строк

Регулярные выражения

Используйте {n} для укорачивания рeгулярных выражений. Например /\d{3}/ вместо /\d\d\d/. И наоборот /\d\d/ вместо /\d{2}/.

Можно использовать eval вместо конструктора регулярки:

Boolean

Используйте ! с цифрами для создания true и false.

Функции

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

Используйте именованные функции для хранения состояния

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

Опускайте скобки при вызове конструктора без аргументов:

Опускайте ключевое слово new там, где это возможно

Некоторым конструкторам вовсе не обязательно ключевое слово new:

Оператор return

Когда надо вернуть что-то отличное от переменной, ставить пробел после return не обязательно: