美文网首页
h5在app页面白屏解决方案

h5在app页面白屏解决方案

作者: 墨__神 | 来源:发表于2019-06-19 16:46 被阅读0次
参考文章:
     - https://zh.wikipedia.org/wiki/HTTP/2
     - https://zh.nuxtjs.org/guide
     - https://nextjs.org/learn/basics/getting-started

目前用户体验最好的方案是客户端缓存+预渲染,这样会解决白屏问题(先上图)。


winwin-FE

方案要点

* 降低io请求
* 使用离线存储存储静态html
* 合理利用浏览器缓存
* 使用预渲染技术,实现对当先项目的二级页面进行预渲染,提升用户体验

技术细节

此方案为治标方案,治本方案在于为什么慢?所以本方案中本本地存储中增加了一段前端通用js,主要作用有两个。
1、上报请求过程中的耗时,通过数据优化耗时的地方。
2、通用的耗时过长的页面处理,优化用户体验。

相关文章

网友评论

      本文标题:h5在app页面白屏解决方案

      本文链接:https://www.haomeiwen.com/subject/vrwkqctx.html