Reactjs 减少大型、基于React的单页应用程序的大小'；浏览包文件

我正在使用gulp和Browserify构建一个reactjs应用程序。我在应用程序中使用了材质ui组件。我的应用程序中有8个页面使用不同的组件

Browserify创建的build.js大小为4mb。我想缩小它的尺寸。我已经搜索并学习了一些关于延迟加载设计模式的知识。但我不知道应该如何使用它来缩小我的应用程序的大小

我还在我的应用程序中使用react路由器，因此定义了8条路由。我有一个想法，我们可以延迟加载每个路由所需的文件，但是如何在react中实现呢

---

附言：我很想和大家分享一些代码，但我不知道这个问题需要什么样的代码。

问题很可能是您的javascript包含源代码映射。源映射可以轻松地将代码的大小增加一个数量级。尝试查看编译后的JS文件，如果看到类似以下内容的大型随机字符串：

dlfheihfgrewifjwe；iofgrewfwejroifnekw.nfoeiquf0eqf；oiwehjfkl；qwejfio；qeo；F奎菲；qejhfkjqwehj

然后在编译的Js中包含源映射

---

检查browserify配置以确保您不是使用源映射进行编译

第一步：

使用缩小

代码，然后使用类似的方法减少重复的路径字符串。