javascript - 构建庞大的应用程序 Assets

Question

我们即将完全重建一个客户网站，它目前有 1000 多个页面。

会有一个剔除，但我的想法是根据页面上的内容动态加载 Assets ，但我想获得反馈。

假设我现在有 100 个全局组件(旋转木马、按钮、视频、Nah 等)，随着时间的推移，我们只是将所有组件的所有 javascript 放入 bundle.js 文件中，与 css 相同，但是如果页面仅使用将这 100 个组件中的 3 个都包含在内似乎是多余的。

所以我想我的问题是在运行时仅动态请求使用的组件而不是每次都加载所有 Assets 是否错误？

我看到的最大缺点是几乎每个页面都会请求新文件，因此缓存会更难，而且必须发出更多 HTTP 请求。

如果有人有更好的想法请告诉我

Answer 1

首先，我建议采用基于证据的方法。不要在没有数据支持决策的情况下做任何事情。

我对整体方法的看法。我在写这篇文章时正在考虑 React，但没有什么是特定于 React 的。

• 服务器呈现您的内容。然后它会显示给您的用户，而无需您的 JavaScript 包。
• 获得良好的 CDN 和/或清漆之类的东西，并缓存每个路由/页面响应。无论网站有多大，您都会得到快速响应。
• 现在，当用户访问页面时，他们会很快得到它，然后您可以异步下载 JavaScript 文件，为页面注入(inject)活力。
• 因为用户已经在阅读您的页面，所以您可以慢慢加载 JS - 最多一两秒。如果您认为大多数用户都拥有不错的互联网(例如，他们都在韩国)，那么在费心进行分块之前，我会使用 2mb 的 JS 包。意见会有所不同，这取决于你。如果您的用户的互联网质量很差(例如，他们都在朝鲜)，那么每个 kb 都很重要，您的目标应该是制作每个页面所需的最小块。兼顾速度和尊重用户的下载配额。