内容在离线网络应用加载时消失了几分之一秒

Question

我在iOS 4.3到5.0上观察过这个.当你创建一个简单的离线Web应用程序,意味着一个HTML文件+少量资产,如CSS和JS(都存在于缓存清单中),它可以脱机工作(我在飞行模式下测试) - 但是,当你添加这样的应用程序到您的主屏幕并以全屏模式打开它,它首先显示初始内容,然后一切消失(页面变为白色)半秒或更长时间,然后内容再次出现.

你可以通过将一个众所周知且有用的离线网络应用程序Glyphboard添加到你的iOS主屏幕并启动它几次来看到这一点.每次加载时都应该看到白色闪光效果.

这是一个很大的问题,因为它会泄露应用程序的非原生性,并给人的印象是应用程序未针对性能和错误进行优化.

我已经尝试过找到关于此的报告,但我能找到的只是关于iOS 4.3 JavaScript渲染引擎惨败的谣言和误解,这根本不需要与此问题相关.但是在iOS版本3中,我记得没有看到过白色闪光.

Answer 1

由于HTML的渐进性,在渲染时清除屏幕和其他工件是HTML渲染的常见问题.这个概念是浏览器应尽可能早地绘制,并在样式/脚本/内容可用时呈现它们.标记可能存在一个问题,即所有渲染都会延迟,直到某些内容或脚本可用.这可能发生在:

• 您具有基于图像尺寸的动态高度,但尚未在标记或CSS中设置图像尺寸.
• 您的布局基于表格,并且您没有在CSS中使用"table-layout:fixed".
• 您的HTML使用带有document.write()的内联脚本.
• 您有某种onLoad()函数可以显示/修改内容.
• 您链接到外部样式表.
• 您正在使用不可缓存的外部内容,或者您​​已禁用缓存.
• 您正在使用返回404或无法离线使用的外部内容.

您的HTML/CSS是否在测试IOS版本之间发生了变化？