异步捆绑

Question

我正在处理页面加载性能 - 主要关注javascript。我的问题是关于异步特定的“捆绑”。我有一些JS模块，理论上可以加载异步，但是，我不太了解组织同步和异步捆绑的最佳方法，以及如何正确定义依赖关系。我指的是这种模式，也称为“延迟加载”。

例如，我有一个 typeahead模块，它可以获取数据joinWith()，然后在输入字段中输入用户的建议。当用户键入不匹配的任何数据getItems匹配的输入时，它会返回消息'无法匹配输入'。此消息需要翻译成各种语言，具体取决于当前设置的语言环境。

我不想加载整个JS翻译脚本，这允许我翻译文本，直到它是必要的，因为它是一个非常大的文件并且真的妨碍了性能 - 我想在实际需要时加载它 - 即当用户初始点击输入字段时，可以获取它。

typeahead.js - 伪示例

handleNoResults

对于管理此类解决方案的某些es6模式的任何建议或指导都将非常感激。

由于

Answer 1

JavaScript本身并不具备捆绑包的概念。本机ES模块（在实现它们的浏览器中）可以import()动态（也可以异步）加载，stage 3 proposal并且limited support in browsers。

您应该使用您选择用于捆绑Webpack的解决方案来解决此问题。它具有code splitting的高级功能，并且还支持import()。