【问题标题】:Why is there a "Loading..." delay for every razor page navigation in a Blazor Webassembly application?为什么 Blazor Webassembly 应用程序中的每个 razor 页面导航都会出现“加载...”延迟?
【发布时间】:2020-12-04 15:30:46
【问题描述】:

我有一个带有两个剃须刀页面的 Blazor Webassembly PWA 应用程序:Index.razor 和 History.razor。每次用户在两个页面之间导航时,在应用加载实际的剃须刀页面之前,页面上都会显示“正在加载...”HTML 的短暂延迟。

我了解,当您第一次在浏览器中打开该应用程序时,它需要下载所有必要的程序集并加载它们。但是一旦他们导航到站点,为什么每个导航都需要显示“正在加载...” html?这通常是很短的时间(我让我的服务人员缓存所有内容),但作为用户,这会让我分心。

我无法在网上找到任何解释这一点的东西。我确定我可能错过了它的实际工作原理,或者我的页面/导航设置不正确?任何有关这方面的信息将不胜感激。页面加载如何与每个导航一起工作?有没有办法防止这种情况发生?

更新:以 Visual Studio 中的 Blazor WebAssembly 模板为例,并按照 Magoo 先生的评论,我能够弄清楚“正在加载...”出现的原因是因为我正在完全重新加载页面。这让我想到了最后一个问题。如果用户当前在索引页面上,并且他们点击导航到索引,有没有办法在不强制刷新的情况下清除该页面上的所有模型?

【问题讨论】:

  • 您如何在页面之间导航 - 因为 Loading... 消息通常只显示整个页面加载
  • 您是否在 Page OnInitialization 生命周期中加载数据,如果是,请确保您异步执行,以便在获取数据时页面不会锁定。
  • @MisterMagoo 你是对的,就是这样。我正在重新加载整页。我能够将导航更改为索引和历史记录,以不重新加载页面,这很有效。但是,如果我当前在索引页面上,并且我希望在点击索引导航菜单项时重新初始化该页面上使用的模型,有没有办法在不完全刷新页面的情况下做到这一点?
  • 你需要确保你没有挂在对模型的任何引用上,然后每个“页面”都应该在你离开时被处理
  • 刚刚看到您更新的问题.. 这更难,我在移动设备上。如果没有其他人可以帮助我稍后再回复您

标签: razor blazor blazor-client-side blazor-webassembly


【解决方案1】:

Service Worker 中缓存的策略有很多,你可以根据自己的需要进行设置

https://developers.google.com/web/tools/workbox/modules/workbox-strategies

我认为“缓存优先”策略适合您

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2010-12-01
    • 1970-01-01
    • 1970-01-01
    • 2021-05-10
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多