测试渐进式 Web 应用程序。
当我在飞行模式下启动应用程序时,我得到了意外的启动/启动体验(Android/Chrome)。
从主屏幕体验启动
我看到一个白色的屏幕,然后是“离线恐龙”的短暂闪烁,然后应用程序成功启动,一切正常。启动时间比我预期的要长,尤其是在笔记本电脑上使用 Chrome Devtools 进行测试后,启动几乎是即时的。
由于调试这些时间花在哪里(特别是在“service-worker-not-running”情况下)有点棘手,因此了解一些基线知识会很有帮助:
从浏览器体验启动
在应用程序成功启动之前,只需短暂闪现“离线恐龙”。启动速度要快得多。
问题
- Android/Chrome 上的预期启动时间和体验如何?
- 上述经历只是目前的情况(11/2015)吗?
- 有没有办法指定 Chrome 的启动(启动)体验? (我知道应用程序清单中的背景颜色和 144x144 图标用于启动,但仅适用于 Opera)
对我来说是第一次 PWA,所以任何有关这方面的信息都会有帮助。
我的平台:
三星GS 5,
安卓5.0,
铬46.0.2490.76
启动画面存在的原因是因为在移动设备上启动渲染过程可能需要一秒钟以上的时间,因此我们绘制一些东西(背景颜色和图标),直到您的应用程序生成了第一个绘制。
如果您在启动时看到白屏,可能是因为您在 Chrome 登陆 (46) 启动画面功能之前添加到了主屏幕。需要注意的一些事项:
- 确保您的清单具有
short_name
and name
- 确保您的 start_url 与页面上注册的 SW 处于同一范围内
- 清单中的图标最好 > 192px
- Set
background_color
在清单中更改为页面背景的颜色(理想情况下)。这将确保启动屏幕是您网站的预期颜色。
即使您处于飞行模式,您也不应该看到离线恐龙。气喇叭 https://airhorner.com应该代表理想的体验:带有一个图标的蓝色启动屏幕,该图标会变形为应用程序的显示。
回复:图标 - 我实际上推荐 192 像素或更高的图标。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)