JavaScript Minification and Optimization

Question

Я немного смущен тем, как лучше всего оптимизировать мои зависимости JavaScript и скрипта.

Предположим, у меня есть сценарий с именем foo.js и сценарий с именем bar.js.

foo.jsjquery ui-sortable, а также bar.jsjquery ui-datepicker.

На моем сайте есть только несколько страниц, для которых требуются как foo.js, так и bar.js.

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

Или было бы лучше назвать их отдельно, только когда это необходимо, и сделать дополнительные HTTP-запросы в этих случаях?

Есть ли лучший вариант, который мне не хватает?

Answer 1

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

Answer 2

Это действительно вопрос торговли, специально связанный с вашим приложением.

Во-первых, вы можете рассмотреть возможность использования jQuery from a CDN, это позволит увеличить вероятность того, что будет нанесен кеш (что уменьшит пропускную способность, используемую вашим сервером), и это гарантирует, что пользователь получит географически близкий ответ ,

Что касается вашего пользовательского кода, лучшим способом оценить влияние оптимизации является запуск тестов для вашего приложения. Попробуйте настроить тест A/B и изучите опыт своих пользователей на своем сайте.

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