网页转换时不会像在网络中畅行无阻
bookmark_borderbookmark
使用集合让一切井井有条
根据您的偏好保存内容并对其进行分类。
快速页面转换对于用户如何看待渐进式 Web 应用 (PWA) 性能至关重要。即使网速较慢,过渡效果也应简洁明快。
建议
如需查找缓慢的页面转换效果,请使用模拟的慢速网络浏览您的 Web 应用。若要在 Chrome 中执行此操作,请执行以下操作:
[comment]: <>(前两个列表项是来自 web.dev 的短代码,但它并没有从英语翻译成任何语言。)
1. 按 Control+Shift+J
(在 Mac 上,按 Command+Option+J
)即可打开开发者工具。
2. 点击网络标签页。
3. 在节流下拉列表中,选择慢速 3G。
每次点按应用中的链接或按钮时,请检查网页是否通过以下两种方式之一立即响应:
- 页面会立即转换到下一个屏幕,并在等待来自网络的内容时显示加载屏幕。
- 当应用等待网络响应时,页面会显示一个加载指示器。
如果您使用的是客户端渲染的单页应用,请立即将用户转换到下一页并显示骨架屏幕。
请确保在加载其余内容的同时立即显示网页标题或缩略图等已有的内容。
资源
如未另行说明,那么本页面中的内容已根据知识共享署名 4.0 许可获得了许可,并且代码示例已根据 Apache 2.0 许可获得了许可。有关详情,请参阅 Google 开发者网站政策。Java 是 Oracle 和/或其关联公司的注册商标。
最后更新时间 (UTC):2024-04-16。
[[["易于理解","easyToUnderstand","thumb-up"],["解决了我的问题","solvedMyProblem","thumb-up"],["其他","otherUp","thumb-up"]],[["没有我需要的信息","missingTheInformationINeed","thumb-down"],["太复杂/步骤太多","tooComplicatedTooManySteps","thumb-down"],["内容需要更新","outOfDate","thumb-down"],["翻译问题","translationIssue","thumb-down"],["示例/代码问题","samplesCodeIssue","thumb-down"],["其他","otherDown","thumb-down"]],["最后更新时间 (UTC):2024-04-16。"],[],[]]