JavaScript минификация и сжатие

Question

Я пытаюсь понять процессы минимизации и сжатия JavaScript, и у меня есть пара вопросов по этим вопросам:

1. Поскольку минификация усложняет отладку кода, возможно ли выполнить де-минимизацию по требованию на стороне клиента, чтобы скрыть случаи, когда вам действительно нужно что-то отлаживать и исследовать на веб-сайте?
2. Я помню, как где-то читал, что можно включить сжатие всех ресурсов (таких как изображения, CSS, JavaScript и т. Д.), Установив некоторые параметры в веб-сервере Apache. Есть ли какая-либо разница в сжатии JavaScript, выполняемом на уровне Apache, и в компрессии, такой как YUI Compressor?

Может кто-нибудь помочь мне узнать выше?

В тех случаях, когда мне действительно нужно было бы деинимифицировать мои файлы JavaScript, скажем, ошибка JavaScript произошла в строке №. X. С минимизированными файлами было бы очень сложно узнать, какой блок кода вызвал эту ошибку в production , поскольку все строки заключены в минимизированный файл. Как вы, ребята, исследуете и отлаживаете в таких обстоятельствах? Другой пользователь также упомянул эту проблему отладки в Упакованный / минимизированный javascript, не работающий в IE6 - как отлаживать? вопросы (хотя и немного специфичные для IE6).

Answer 1

Вы не должны отлаживать минимизированный код.В идеале процесс разработки должен выглядеть так:

1. Вы создаете и отлаживаете сайт локально.У вас есть полные версии JavaScript, таблиц стилей и всего остального.

2. Развертывание версии на рабочем компьютере.Вы минимизируете и копируете копии своих активов и отправляете их на сервер.Ваша локальная копия разработки остается нетронутой.

3. Если в работе есть ошибка, вы изменяете локальную версию, уменьшаете, сжимаете, загружаете.

Повторять до получения прибыли

Answer 2

Chrome Dev Tools могут де-обфускацировать (и де-минимизировать) код JavaScript, если вы хотите отлаживать производственный код (полезно при попытке воспроизвести ошибку в реальной среде, которую вы, возможно, не видите в dev)

Answer 3

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

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

И да, Apache и даже IIS могут автоматически сжимать сценарии и изображения gzip.

Answer 4

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

Вроде.Сокращенный JavaScript имеет ту же структуру, он просто делает такие вещи, как удаление лишних пробелов и сокращение имен переменных.Таким образом, вы можете легко сделать код снова читаемым, либо вручную, либо с помощью скрипта, но вы не можете восстановить имена переменных, так что с кодом все равно будет сложнее работать.Так что, если у вас есть оригинальный код, определенно не избавляйтесь от него.Сохраняйте минимизированный код отдельно.

Я помню, как где-то читал, что можно включить сжатие всех ресурсов (таких как изображения, CSS, JavaScript и т. Д.), Установив некоторые параметры на веб-сервере Apache.

Да, это называется сжатием gzip.Он не уникален для apache, но вам нужно настроить свой сервер для его включения.

Есть ли разница в сжатии javascript, выполняемом на уровне Apache, и в том, который выполняется с использованием таких инструментов, как YUI Compressor?

Да.Компрессор YUI - это минификатор - на выходе допустим JavaScript.Сжатие на стороне сервера больше похоже на сжатие файла - браузер должен декодировать его перед использованием.Совместное использование этих двух файлов даст наименьший размер файла.

Answer 5

возможно ли выполнить де-минимизацию по требованию на стороне клиента

Некоторые браузеры имеют представление «красивый код», которое автоматически форматирует исходный код. См. Вкладку CSS Firebug.

Есть ли разница в сжатии javascript, выполняемом на уровне Apache, и в сжатии, выполняемом с помощью таких инструментов, как YUI Compressor?

YIU Compressor - фактически минификатор. Сжатие Apache похоже на архивирование файла перед его отправкой клиенту, поэтому фактический отправляемый файл меньше файла на диске. Это две разные технологии, которые не зависят друг от друга.

Answer 6

1. Я предпочитаю работать с локальной unminified копией JS-файла, и когда я развертываю сайт, я минимизирую все JS-файлы в один.Таким образом, код легко отлаживать и улучшать.Тем не менее, есть инструменты для восстановления минификации.Взгляните на эту ТАК сообщение о восстановлении минимизации JavaScript.
2. Посмотрите на сжатие GZIP - В этом блоге описано, как включить GZIP в Apache и какубедитесь, что ваш сервер на самом деле сжимает файлы.