我在iOS 4.3到5.0上观察过这个。当你创建一个简单的离线网络应用程序,意味着一个HTML文件+少量资产,如CSS和JS(都存在于缓存清单中),它可以脱机工作(我在飞行模式下测试) - 但是,当您将这样的应用程序添加到主屏幕并以全屏模式打开时,它首先显示初始内容,然后一切消失(页面变为白色)半秒或更长时间,然后内容再次出现试。
您可以通过将Glyphboard(一个众所周知且有用的离线网络应用)添加到您的iOS主屏幕并启动它几次来看到这一点。每次加载时都会看到白色闪光效果。
这是一个很大的问题,因为它会泄露应用程序的非原生性,并给人一种应用程序未针对性能和错误进行优化的印象。
我已经尝试过查找有关此问题的报告,但我能找到的只是关于iOS 4.3 JavaScript渲染引擎惨败的谣言和误解,这根本不需要与此问题相关。但是在iOS版本3中,我记得没有看到过白色闪光灯。
答案 0 :(得分:5)
由于HTML的渐进特性,在渲染时清除屏幕和其他工件是HTML渲染的常见问题。这个概念是浏览器应尽可能早地绘制,并在样式/脚本/内容可用时呈现它们。标记可能存在一个问题,即所有渲染都会延迟,直到某些内容或脚本可用。如果出现这种情况:
您的HTML / CSS是否在测试IOS版本之间发生了变化?
答案 1 :(得分:2)
我发现这是由于使用:
引起的<meta name="viewport" content="width=device-width initial-scale=1.0 maximum-scale=1.0 user-scalable=0">
使用最小页面,如果我使用视口元标记,我会在apple-touch-startup-image和页面内容之间出现白色闪烁。如果我拿出标签,没有闪光灯。
可以通过以编程方式设置标记来解决此问题。
答案 2 :(得分:1)
我认为这里发生的事情是iOS在页面添加到主菜单时会截取屏幕截图。然后在应用程序加载期间显示此屏幕截图(WebKit加载)。 WebKit开始渲染页面,页面本身的构造方式使页面内容不会立即可用,导致白色闪存,当页面内容尚未出现时,它是一个呈现的页面,
您可以通过构建JS / CSS来避免问题达到一定程度,以便快速加载初始HTML视图,然后在后台懒惰地加载/构建其余资源。您也可以设置自定义加载屏幕,而不是iOS在页面中使用的默认屏幕截图。
也许你可以自己截取你的应用程序的截图,然后有这样的东西:
<body style="background: white url('my-initial-loading-screen.png')" />
...并确保图像可用并来自清单。
甚至更好,有加载屏幕,不需要任何外部资源显示(只是纯HTML),所以你知道浏览器不需要加载任何东西。