Question

My question is simple:

Are there any (existing or planned) enhancements to the HTTP/SPDY protocols, or extensions which have been written to enable browsers to modify their rendering routine such that Flash of Un-Whatever Content can be hidden from the user?

Of course, IE users will be behind everyone else, but this I think would be a sensible enhancement to the wire protocol, requiring only an extra couple bytes or so, and cutting down on a fair bit of extra JS rendering.

Or would this strategy fly in the face of the general Progressive Enhancement philosophy?

As noted in the comments, this can be implemented as a third party extension, or would it be better to implement as a centralized standard?

No correct solution

OTHER TIPS

HTML Imports would be one such feature:

HTML Imports block rendering of the main page. This is similar to what <link rel="stylesheet"> does. The reason the browser blocks rendering on stylesheets in the first place is to minimize flash of unstyled content (FOUC). HTML Imports behave similarly because they can contain stylsheets.

With this change, all document.write output from <script> tags inside HTML imports go to the imported HTML documents. This eliminates the problem of the HTML imports clearing the main page.

Link prerender would be another:

IE11 can prerender one page in the background. If a second prerender request is encountered, it replaces the first request. Additional prerender requests are ignored.

<link rel="prerender" href="http://example.com/" />

Developers can fine-tune the way that IE11 prioritizes resource download. The built in priority scheme may not be sufficient for some Web pages. For example, developers may want to indicate that images located below the fold should be prioritized lower than more important resources located above the fold.

And the IE specific lazyload attribute is a third:

Developers can lower the priority of a resource by adding the lazyload tag:

<img src="image.jpg" lazyload  />

And finally, the defer and async attributes of the <script> element:

Usage   	 	 	 	 	 Description

<script src="widgets.js"></script> 	 	 The script is executed immediately, and the page waits for the script to finish before continuing to parse. This can significantly reduce page-load performance.

<script async src="widgets.js"></script> 	 The script is downloaded asynchronously while the page continues to parse. The script executes after the download has completed.

<script defer src="widgets.js"></script> 	 The script is executed when the page is finished with the parsing.

<script async defer src="widgets.js"></script> 	 The async attribute is honored, and the defer attribute is ignored. This enables developers to use async in browsers that support it, but fall back to defer in browsers that don't support async.

References

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top