Content disappears for fraction of a second on offline web app load

Question

I\'ve observed this on iOS 4.3 to 5.0. When you create a even a simple offline web app, meaning one HTML file + few assets such as CSS and JS (all present in the cache manifest)

Answer 1

Clearing the screen and other artifacts while rendering is a common issue of HTML rendering due to the progressive nature of HTML. The concept is that the browser should draw as early and often as possible and render styles/scripts/content as they become available. It's possible the markup has an issue where all rendering is delayed until some content or a script is available. This could happen if:

• You have dynamic heights based on image dimensions but you haven't set the image dimensions in the markup or CSS.
• Your layout is based on tables and you aren't using 'table-layout:fixed` in CSS.
• Your HTML uses inline scripts with document.write().
• You have some kind of onLoad() function that reveals/modifies content.
• You link to an external stylesheet.
• You're using uncacheable external content or you've disabled caching.
• You're using external content that's returning 404 or isn't available offline.

Has your HTML/CSS changed between testing IOS versions?