Оптимальный способ объединения файлов JS на сайте

Question

У меня есть веб-сайт, на котором есть страницы 1,2,3 и js-файлы A, B, C, D, E, X и Y. Ниже приводится описание файлов, включаемых на каждой странице:

Page 1: A
Page 2: A, B, C, D, E
Page 3, A, B, C, X, Y

В настоящее время все эти файлы отправляются отдельно, и для их первой загрузки требуется некоторое время. Я знаю, что объединение их в один файл сокращает время передачи, так что это мой план. Но в этом случае я не хочу объединять их все в один файл, потому что страница 3 может извлечь выгоду из страницы 2, уже имея кешированные A, B и C (что было бы невозможно, если бы существовал большой файл ABCDE и большой файл ABCXY). И да, пользователи будут переключаться между 2 и 3 при обычном использовании.

Но ответ здесь не обязателен, просто «создайте ABC-файл, DE-файл и XY-файл и будьте готовы», потому что описанная мной ситуация является лишь частью более серьезной проблемы.

Как люди обычно имеют дело с объединением файлов JS на веб-сайте, где некоторые страницы разделяют некоторые файлы?

Примечание 1: все файлы имеют порядок от нескольких сотен до нескольких тысяч строк.

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

Answer 1

моей первой мыслью было минимизировать файлы javascript, это вариант? это может решить вашу проблему загрузки нескольких файлов; Как вы загружаете файлы, это часть шаблона?

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

Answer 2

У меня такая же ситуация в моем проекте, десятки общих сценариев, и у каждой страницы есть свой дополнительный набор.Я использую эту опцию:

Page 1: A
Page 2: ABC, DE
Page 3: ABC, XY

Да, вероятно, было бы лучше иметь ABCDE, и тогда у вас есть один http-запрос, но это сделает поддержку немного сложнее (нужно помнить, чтобы добавить новый общий скриптна все страницы), поэтому не делайте этого, пока вы действительно не увидите, что ваш сервер страдает от количества запросов.Преждевременная оптимизация - это зло!

Другая проблема: браузер может загружать 2 файла скрипта из одного домена одновременно (некоторые из новых браузеров даже увеличили это число), поэтому клиентская сторона не будет заблокирована в ожидании загрузки скриптов.Таким образом, использование такого подхода не должно быть проблемой, и вы по-прежнему можете поддерживать его простым способом.

Также вы можете подумать о библиотеке, которая может его автоматизировать.Для Java вы можете взглянуть на Jawr , я не знаю, какова ваша серверная сторона, так что просто посмотрите на его возможности и найдите что-то похожее для вашей среды.

ADD-ON: всплывает только одна проблема, с помощью Jawr мы можем использовать режим «отладки», что означает, что все файлы будут отправляться отдельно, и это хорошо для разработки.В производстве мы устанавливаем jawr.debug.on = false, и он использует связки.

Другими словами, при разработке приложения:

Page 1: A
Page 2: A, B, C, D, E
Page 3: A, B, C, X, Y

на производстве мы используем ABC ... это делается просто путем изменения конфигурации jawr, и imho, это лучший путь.Если вы используете Java, вы можете потратить некоторое время, играя с ним, в противном случае действительно стоит найти подобный фреймворк / библиотеку.