Current time: 12-07-2019, 09:42 PM Hello There, Guest! (LoginRegister)

Post Reply 
 
Thread Rating:
  • 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
Inconsistent Start Render
06-19-2015, 01:51 PM
Post: #1
Question Inconsistent Start Render
Hello all,

I understand that the current trend in website optimization is to start rendering the webpage as quickly as possible which can be done by eliminating render blocking JavaScript and CSS in above the fold content.

I've done exactly that and PageSpeed Insights does not warn me on that.
https://developers.google.com/speed/page...d.cc/blog/

Weirdly when I ran 20 tests in WebPagetest, only 4 results shows an early page rendering.
http://www.webpagetest.org/result/150619_SS_4TM/
http://www.webpagetest.org/result/150619_AR_53B/
http://www.webpagetest.org/result/150619_G0_5YN/
http://www.webpagetest.org/result/150619_HF_62R/

While the other 16 tests shows that the page only started to render after CSS, JS and web fonts are loaded.
http://www.webpagetest.org/result/150619_B6_52H/
http://www.webpagetest.org/result/150619_QF_549/
http://www.webpagetest.org/result/150619_CQ_55Z/
http://www.webpagetest.org/result/150619_F5_56R/
http://www.webpagetest.org/result/150619_WC_58Y/
http://www.webpagetest.org/result/150619_W8_5AV/
http://www.webpagetest.org/result/150619_F9_5GM/
http://www.webpagetest.org/result/150619_DT_5HC/
http://www.webpagetest.org/result/150619_6G_68E/
http://www.webpagetest.org/result/150619_Y1_68P/
http://www.webpagetest.org/result/150619_JA_6AF/
http://www.webpagetest.org/result/150619_QT_6B3/
http://www.webpagetest.org/result/150619_67_6BV/
http://www.webpagetest.org/result/150619_MV_6HK/
http://www.webpagetest.org/result/150619_WZ_6J2/
http://www.webpagetest.org/result/150619_YP_6JN/

The WordPress plugin "WP Deferred Javascripts" is used to defer JS.
https://wordpress.org/plugins/wp-deferred-javascripts/

I use the following JavaScript to load CSS asynchronously.
https://github.com/filamentgroup/loadCSS/

Theoretically, with CSS above the fold being added to the head, and all other files (CSS, JS, web fonts) being deferred, the render should start nearly instantly after the first HTML page being downloaded to the web browser.

Can anyone figure out what might be causing the problem of sometimes not being able to quickly render after downloading the first HTML page?

Thanks.
Find all posts by this user
Quote this message in a reply
06-25-2015, 12:20 AM
Post: #2
RE: Inconsistent Start Render
Chrome has a (bug/feature/issue) where any external css is considered to be render-blocking as soon as it is parsed, regardless of where it is in the document. I know there are discussions going on to fix the behavior so that styles in the body will not be render-blocking but that hasn't been changed yet.
Visit this user's website Find all posts by this user
Quote this message in a reply
06-25-2015, 01:06 PM
Post: #3
RE: Inconsistent Start Render
Thanks for responding Patrick.
That explains why Firefox works all the time but very randomly in Chrome.
Find all posts by this user
Quote this message in a reply
Post Reply 


Forum Jump:


User(s) browsing this thread: 2 Guest(s)