Лучше ли минимизировать Javascript в один пакет для всего сайта или пакет для каждой отдельной страницы?

Question

При минимизации JavaScripts в веб-разработке лучше с точки зрения времени загрузки пользователя:

1. создайте один большой пакет JavaScript, содержащий все сценарии, и включите его на каждой странице - так что каждой странице, вероятно, не понадобится все это, но как только пользователь кеширует ее, им не нужно будет дальше скрипты (конечно, пока они не истекают из их кэша) - оптимизация для количества запросов
2. создать по одной пачке JavaScript на странице, чтобы каждая страница загружала только тот сценарий, который ей нужен, и ничего больше - поэтому каждая страница при первой загрузке обязательно будет требовать JS-запрос (но все равно впоследствии будет кешироваться. из-запросов.

Меня интересуют некоторые данные, на которых можно основывать решение, с которым следует придерживаться стратегии. Я могу прийти к выводам на основе анекдота так же легко, как и все остальные: -)

Answer 1

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

Взять переполнение стека, например. На каждой странице сайта есть файл master.js , но при посещении страницы с вопросом или страницы «задать вопрос» вы заметите wmd.js . Этот скрипт включает в себя все функции редактора, которые необходимы на меньшем количестве страниц.

Answer 2

Я бы предпочел иметь 1 минимизированный js-файл для всего сайта.В течение определенного периода времени это всегда работает лучше, чем наличие нескольких js-файлов.

Проверьте эту ссылку для более подробной информации

Answer 3

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

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

Наличие общих функций в одном файле и отдельных сложных сценариях для конкретной страницы также обычно удобнее в обслуживании.

Answer 4

Если вы внедряете веб-сайты в ASP.NET MVC, наиболее подходящим может оказаться следующий подход, который я использую все время.

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

Остальная часть JavaScript обычно предназначена для локального использования, т. Е. Только в одном представлении, эффективно реализуя представление. И по этой причине он должен находиться в пределах видимости, полностью несжатый.

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

Суть в том, что не пытайтесь обременять себя связыванием JavaScript, предназначенного для локального использования. Объединяйте только самые общие вещи и делайте это в одном месте - на главной странице вашего продукта. Оставьте локальный JavaScript несжатый в локальных файлах, где он используется. Это не оказывает реального влияния на производительность, но делает ваш код намного проще для понимания и сопровождения.