问题描述
我有一些用于录音和转换为 .mp3 的 JS 库，我想在我的 Blazor 网站的一个页面上使用它们。但我绝对不希望网站的所有访问者都预加载超过 1 MB 的 JavaScript，以防他们导航到网站的该部分。
有什么想法吗？
解决方法
为什么不使用 dynamic import？
import('module.js').then(module => {
...
});
我假设您正在编写一个单页应用程序。有几种方法可以做到这一点。
我推荐的一个好方法是 JavaScript 的延迟加载，这样文件只在您真正想要调用文件内容时加载。要对此进行更多研究，我建议您查看：https://developer.mozilla.org/en-US/docs/Web/Performance/Lazy_loading。
如果您有这些库的 WebAssembly 副本，那么由于您使用的是 Blazor，您应该能够使用 Blazor 延迟加载这些库。有关详细信息，请参阅 https://docs.microsoft.com/en-us/aspnet/core/blazor/webassembly-lazy-load-assemblies?view=aspnetcore-5.0。
您将在之前的帖子中看到，执行此操作的旧方法是使用 jQuery。然而，这不再是推荐的做法。 jQuery 提供了一个 getScript 方法，请参阅 https://api.jquery.com/jquery.getscript/ 文档或 Dynamically load JS inside JS 作为已讨论过的区域。