Какой лучший способ уменьшить размер моих файлов Javascript и CSS? - PullRequest
19 голосов
/ 15 сентября 2008

При работе с большими и / или многими файлами Javascript и CSS, как лучше всего уменьшить размер файла?

Ответы [ 18 ]

1 голос
/ 16 сентября 2008

Помощь YUI Compressor дает несколько полезных советов о том, как настроить скрипты для достижения еще большей экономии.

0 голосов
/ 16 сентября 2008

YUI Compressor отлично справляется со сжатием Javascript и CSS.

0 голосов
/ 21 декабря 2015

Я нашел JSCompress хороший способ не только минимизировать JavaScript, но и объединить несколько скриптов. Полезно, если вы используете разные сценарии только один раз. Сохранено 70% до сжатия (и что-то похожее после сжатия).

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

0 голосов
/ 17 июня 2009

Попробуйте инструменты веб-компрессора от Boryi , чтобы сжать ваш стандартный файл HTML (без встроенного кода Javascript и кода CSS, но можно связать или импортировать), код Javascript (правильно заканчивающийся на;) и CSS код.

0 голосов
/ 22 сентября 2008

CssTidy - лучший CSS-оптимизатор, который я знаю. Он (настраиваемо) удаляет комментарии, удаляет пробелы, переписывает для использования многих сокращенных правил упомянутый ник и т. Д. Сжатие результата также помогает, как уже упоминали другие.

Степень сжатия может быть довольно драматичной, и вы можете свободно комментировать свой CSS, не беспокоясь о размере файла.

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

0 голосов
/ 16 сентября 2008

YUI Compressor имеет мой голос по той простой причине, что вместо того, чтобы просто выполнять преобразования регулярных выражений в коде, он фактически создает дерево разбора кода, подобное интерпретатору Javascript, а затем сжимает его таким образом. Как правило, он очень осторожен с обработкой идентификаторов.

Кроме того, у него есть режим сжатия CSS, с которым я не так много играл.

0 голосов
/ 15 сентября 2008

Для javascript, я использую Javascript Packer Дина Эдвардса . Он был портирован на .NET, perl, php4, php5, WSH, и есть даже плагин aptana.

Упаковка Javascript поставляется в нескольких вариантах - некоторые просто удаляют комментарии и пробелы, другие изменяют имена переменных, чтобы быть краткими, а другие, ну, я даже не знаю, что они делают, но вывод, конечно, небольшой , Сжатие высокого класса работает с использованием функции eval (), которая создает дополнительную нагрузку на клиента, поэтому, если ваши сценарии особенно сложны или вы разрабатываете для более медленного оборудования, имейте это в виду. упаковщик Javascript дает вам возможность выбрать уровень сжатия, который вы хотите использовать.

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

function compressCSS($css) {
    return
        preg_replace(
            array('@\s\s+@','@(\w+:)\s*([\w\s,#]+;?)@'),
            array(' ','$1$2'),
            str_replace(
                array("\r","\n","\t",' {','} ',';}'),
                array('','','','{','}','}'),
                preg_replace('@/\*[^*]*\*+([^/][^*]*\*+)*/@', '', $css)
            )
        )
    ;
}

Хотя эта функция и упаковщик Javascript уменьшат размер отдельных файлов, для достижения максимальной производительности вашего сайта вы также захотите сократить количество HTTP-запросов, которые вы делаете. Каждый файл Javascript и CSS представляет собой отдельный запрос, поэтому объединение их в один файл приведет к оптимальному результату. Вместо того, чтобы пытаться сохранить один файл JS, вы можете использовать программу / технику, которую я написал в своем блоге (бесстыдная самостоятельная вставка) на http://spadgos.com/?p=32

Программа в основном считывает файл типа «сценарий сборки», который будет одновременно объединять и сжимать несколько файлов Javascript и CSS в один (каждый) для вас (или больше, если хотите). Есть несколько вариантов вывода и отображения всех файлов. Там есть большая статья и источник в свободном доступе.

0 голосов
/ 16 сентября 2008

Я бы дал тест-драйв новым оптимизаторам времени выполнения в ASP.Net, опубликованным http://www.codeplex.com/NCOptimizer

...