什么是一个渐进式Web应用程序的预期启动体验？ [英] What is the expected startup experience for a Progressive Web Application?
问题描述
测试一个渐进的Web应用程序。
Testing a Progressive Web Application.
当我开始在飞行模式下的应用程序，我得到一个意外的启动/飞溅的经验（的Android / Chrome浏览器）。
When I start the app in airplane mode, I get an unexpected startup/splash experience (Android/Chrome).
从主屏幕体验启动
我看到一个白色的屏幕，其次是应用程序之前，离线恐龙的短暂闪烁成功启动，一切都很好。启动时间比我预期的，尤其是在笔记本电脑上，在启动时附近即时使用Chrome测试Devtools后。
I see a white screen, followed by a brief flash of the "offline dinosaur" before the app successfully starts and all is well. The startup time is longer than I expected, especially after testing with Chrome Devtools on a laptop, where startup is near instant.
既然是有点棘手的调试，其中该时间被消耗（特别是在服务工人不跑的情况下），这将是有帮助的一些基本知识：
Since it is a little tricky to debug where this time is being spent (especially in the "service-worker-not-running" case), it would be helpful to have some baseline knowledge:
从浏览器体验启动
离线恐龙成功启动应用程序之前，只是一个短暂的闪光。启动快多了。
Just a brief flash of the "offline dinosaur" before the app successfully starts. Starts much faster.
问题
- 什么是预期的启动时间和经验在Android / Chrome浏览器？
- 是上面只是事情的当前状态（二千零一十五分之十一）？ 描述的经验
- 有没有办法来指定Chrome的启动（闪）的经验？ （我知道的背景颜色，并在应用程序清单飞溅144x144的图标，但对于歌剧专用）
第一次PWA我，所以这方面的消息将是有益的。
First time PWA for me, so any information on this would be helpful.
我的平台：
三星GS 5，
的是Android 5.0，
镀铬46.0.2490.76
My platform: Samsung GS 5, Android 5.0, Chrome 46.0.2490.76
推荐答案
究其原因，闪屏的存在是因为手机它可以接管第二次启动渲染过程，所以我们画的东西（背景颜色和图标）UTIL你必须通过你的应用程序生成的第一痛苦。
The reason for the existence of the splash screen is because on mobile it can take over a second to start the render process so we paint something (the background colour and icons) util you have a first pain generated by your app.
如果您在启动这可能是因为您加入到之前到Chrome浏览器主屏幕着陆（46）的闪屏功能，看到一个白色的屏幕。有些事情要了望：
If you are seeing a white screen on startup it might be because you added to the homescreen prior to Chrome landing (46) the splash screen feature. Some things to lookout for:
- 确保您的清单有一个
SHORT_NAME和名称 - 确保您的START_URL是在同一范围为SW被注册的页面上
- 您可以在清单的理想> 192px
- 设置
BACKGROUND_COLOR在清单到你的背景页面上的颜色（理想）。这将确保启动画面是你的网站的预期颜色。
- Ensure your manifest has a
short_nameandname - Ensure your start_url is in the same scope as a SW that is registered on the page
- Have good icons in the manifest ideally > 192px
- Set
background_colorin the manifest to the color of your background on the page (ideally.) This will ensure that the splash screen is the expected colour of your site.
您不应该看到离线恐龙可言，甚至当你在飞行模式下。 Airhorner 应该重新present理想的经验：蓝色闪屏与摇身一变到应用程序的显示图标
You shouldn't see the offline dinosaur at all, even when you are in aeroplane mode. Airhorner should represent the ideal experience: Blue splash screen with an icon that morphs into the display of the app.
重：图标 - 其实我建议192px图标或更高
re: Icons - I recommend actually 192px icon or higher.
这篇关于什么是一个渐进式Web应用程序的预期启动体验？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
