当前位置: 首页 > 文档资料 > Rax 中文文档 >

渲染节点快照

优质
小牛编辑
123浏览
2023-12-01

加载页面时 <div id="root"></div> 这样的占位空节点在 js bundle 未生效前表现为白屏。网速差 js bundle 加载慢时,白屏时间增长会造成不好的体验。

节点快照可将 HTML 容器填充为用户上一次访问时对应的内容,极速展示页面内容,提升首屏加载速度。

第一步:在工程配置 build.json 中的 build-plugin-rax-pwa 添加 snapshot 选项开启保存至桌面功能:

{
	"plugins": [
		[
			"build-plugin-rax-pwa",
			{
				"snapshot": true
			}
		]
	]
}

第二步:在 app.json 中开启 Hydrate 渲染

{
	"hydrate": true
}