Куча пачек Webpack или один? - PullRequest
Новая
       25

Куча пачек Webpack или один?

0 голосов
/ 19 мая 2018

У меня есть устаревшая кодовая база с кучей require(), разбросанных по всему проекту.Например, основной модуль приложения выглядит примерно так: 

define([
  'underscore',
  'jquery',
  //... another modules
], function(_, $) {
  exports.pay = function() {
    return new Promise(function(resolve, reject) {
      require([
        'modules/payment/PaymentModel',
        'modules/payment/PaymentView',
      ], function(PaymentModel, PaymentView) {
        PaymentView.getInstance(PaymentModel).getPaid().then(resolve, reject);
      });
    });
  };
})

Или даже с динамическим именованием в середине модулей. 

define([/*...*/], function(/*...*/) {
  /*...*/
    require([
      'modules/'+moduleName+'/'+moduleName+'Model',
      'modules/'+moduleName+'/'+moduleName+'Collection',
      'modules/'+moduleName+'/'+moduleName+'CollectionView'
    ], function(Model, Collection, CollectionView) {
      /*
        some code here
      */
    });
  /*...*/
});

В результате мы имеем медленный проект в производстведо 70-90 файлов js, которые загружаются отдельно.Как вы можете понять, нет никакого упаковщика вообще.Я не знаю идею предыдущего разработчика, но думаю, что это было что-то вроде ленивой нагрузки.Моя главная задача - ускорить проект.Поэтому я решил взять Webpack , чтобы инкапсулировать весь код в один пакет.Но в процессе я столкнулся с множеством проблем, таких как описанная проблема с динамическими нагрузками.Webpack создает около 30 пакетов с общим размером около 900 КБ, что составляет 200 КБ после gzipping. 

$ find build/ -type f -name '*bundle.js' -exec ls -l {} \; | awk '{total = total + $5}END{print total}'
878054

Как бы вы решили проблему медленного проекта в этом случае?Вы бы использовали Webpack?Если это так, вы бы стремились объединить все файлы JS в один пакет или оставить отдельные пакеты, созданные Webpack, как есть?

...