Производительность парсинга Javascript и CSS

Я считаю, что YSlow работает, но имейте в виду, что если все запросы не проходят через соединение с обратной связью, вам не следует беспокоиться. Накладные расходы HTTP на разделенные файлы будут влиять на производительность далеко больше, чем на синтаксический анализ, если ваши файлы CSS / JS не превышают несколько мегабайт.

Контекст: Хотя верно, что накладные расходы HTTP более значительны, чем синтаксический анализ JS и CSS, игнорирование влияния синтаксического анализа на производительность браузера (даже если у вас меньше мегабайта JS) - хороший способ навлечь на себя проблемы.

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

Скорость синтаксического анализа немного сложно измерить, но мы несколько раз отслеживали эту метрику в проектах, над которыми я работал, и влияние на загрузку страниц было значительным даже с ~ 500 КБ JS. Очевидно, что больше всего страдают старые браузеры ... надеюсь, Chrome, TraceMonkey и подобные им помогут разрешить эту ситуацию.

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

Однако вполне может случиться так, что, скажем, 50% вашего JS никогда не понадобятся 80% ваших пользователей из-за ваших шаблонов трафика. Если это так, вам определенно следует использовать меньшие, упакованные полезные нагрузки JS только на тех страницах, где JS необходим. В противном случае 80% ваших пользователей понесут ненужные штрафы за парсинг JS на каждая загрузка страницы.

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

Чтобы добавить к отличному ответу kamen, я бы сказал, что в некоторых браузерах время синтаксического анализа для больших ресурсов js растет нелинейно. То есть, для синтаксического анализа JS-файла размером 1 мегабайт потребуется больше времени, чем для анализа двух файлов по 500 КБ. Поэтому, если большая часть вашего трафика - это люди, которые, вероятно, будут кэшировать ваш JS (вернувшиеся посетители), и все ваши файлы JS устойчивы к кешированию, может иметь смысл разбить их, даже если вы в конечном итоге загрузите их все на каждый просмотр страницы.