如何在浏览器上删除 Blazor 应用程序加载时间答案

【问题标题】：How to remove Blazor app loading time on browser如何在浏览器上删除 Blazor 应用程序加载时间
【发布时间】：2021-07-23 01:27:45
【问题描述】：

我刚刚创建了一个演示 Blazor Web 程序集应用程序，并意识到在浏览器中刷新应用程序将显示 index.html 页面中的“正在加载...”文本。即使删除了此文本，应用程序重新加载也会在浏览器上显示白屏（这意味着加载应用程序组件需要几毫秒）。有什么办法可以完全消除这个间隙并在浏览器页面上快速加载应用程序组件？还是和应用内存有关系？

因为当我通过 IIS 服务器托管此应用并在浏览器上运行它时，应用刷新需要更多时间来重新加载。

PS: I'm not looking for any custom loading screens, rather avoid this completely.

【问题讨论】：

您阅读过文档吗？您尝试了其中的哪些建议？
是的，我的应用程序具有页眉、页脚、轮播等组件，以及附加信息显示组件（共 4 个）。此外，还有来自 Header 组件的 JS 互操作调用，用于在组件本身中加载特定样式和其他单击和鼠标悬停功能。我最小化了大多数这些调用和悬停功能。还减少了组件之间通过参数传递的数据。
在构建发布和发布之后，应该不会花那么长时间。另外，在浏览器上启用缓存，否则每次都会下载程序集。
如果有办法加快速度，您不认为它已经实现了吗？
我见过的一个解决方案是：使用标准的 MVC 页面作为登录页面。然后将 Blazor 页面用于您网站上的其他页面。理由是：您希望您的目标网页尽可能快地加载，以免失去用户的兴趣。如果您网站上的其他页面加载速度较慢，这可能是可以接受的。

标签： load blazor blazor-webassembly

【解决方案1】：

您正在寻找的是预渲染：

https://docs.microsoft.com/en-us/aspnet/core/blazor/components/prerendering-and-integration?view=aspnetcore-5.0&pivots=webassembly

这允许将组件呈现为静态 HTML，在首次加载时提供给浏览器（没有加载...屏幕），然后“水合”组件以启用功能。

【讨论】：

【解决方案2】：

初始加载来自应用程序将 .NET 运行时传输到浏览器，您可以在此处的文档中看到：https://docs.microsoft.com/en-us/aspnet/core/blazor/webassembly-performance-best-practices?view=aspnetcore-5.0

您可以按照“最小化应用程序下载大小”部分中详述的一些建议进行操作。我主要看的两件事是 IL Trimming，您可以对其进行配置以减少框架传输的内容，以及延迟加载，以便在启动应用程序时仅加载最低限度的内容。

【讨论】：

我在将项目发布版本发布到服务器之前进行了 IL 修整，并删除了所有未使用的程序集文件。不过，我看到加载延迟。是否有任何延迟加载技术来加载主页图像（轮播中的第一张图像）？因为图像加载在本地大约需要 190-230 毫秒，而从部署服务器则需要超过 780 毫秒。