How to remove render-blocking javascript and optimize css in above the fold content?

[asabet]

Originally Posted by Dave

A) According to this, you need to add the async attribute to all script tag references. I'm not sure if that will work though.

B) You could merge a bunch of CSS templates together in vBulletin, but this may result in issues when a certain template doesn't load certain CSS templates.

Those are the kinds of things I was thinking about, but I was hoping someone had gone down that road and could tell me exactly what to do.

Originally Posted by Max Taxable

To the OP: I don't use or recommend Google PageSpeed. Try http://webpagetest.org instead.

I use both, and they both indicate that those JS and CSS are delaying page load.

Originally Posted by Dave

When I disable Cloudflare on my forum it loads slower than when it's enabled....

If OP wants another tip, optimize all of your images with https://kraken.io/web-interface (choose lossless unless you don't mind losing a bit of quality)

Cloudflare seemed to lower my Adsense revenue. I do need to optimize my images...

Originally Posted by Max Taxable

Meanwhile, again to the OP - At Ozzmodz we have a vBulletin optimization forum with actual case histories and actual results, how-to, and tips.

Here.

I've read there - lot's of good tips there that I have implemented. But I didn't see anything about inlining or combining vBulletin CSS or about defering/async for vBulletin scripts.

Originally Posted by Max Taxable

By the way, also to the OP - you have a flash object that is 14.5 percent of your pageload. If ever there was something that would interrupt, slow down or block render, it's a flash object. Especially a big one.

Just FYI.

Must have been an ad. There's no flash in my website. The Google ads are asynchronous and thus don't delay page loading. The Amazon ads are not async, but they pay very well.

[Max Taxable]

Originally Posted by asabet

I use both, and they both indicate that those JS and CSS are delaying page load.

There's no indication of that at all, here.

http://www.webpagetest.org/result/150113_Y3_W40/

There aren't any delays in your waterfall. Everything is loading nicely, uninterrupted.

The only real issue you have is cache of static content. Pretty sure you fix that, reading the article at OzzModz about speeding up your site via .htaccess and the one about speeding up your site via AdminCP.

[Max Taxable]

Originally Posted by asabet

The Google ads are asynchronous and thus don't delay page loading.

This is a myth. They still add kb load to your page therefore, do take time to render. They're also from a third party - if there's a slow load from the 3rd party that means a slow load for you.

Part of the compromise to monetize, as they say. Nothing you can do there.

[Max Taxable]

Here's two of the flash objects, they're present in every test I run and take up about 77kb.

PHP Code:

URL: http://ds.serving-sys.com/BurstingRes//Site-501/Type-2/21ca2a22-3446-40ed-a00d-e0f68b03fe79.swf
Host: ds.serving-sys.com
IP: 23.0.160.83
Location: Akamai
Error/Status Code: 200
Client Port: 59942
Start Offset: 2.324 s
Time to First Byte: 36 ms
Content Download: 61 ms
Bytes In (downloaded): 39.2 KB
Bytes Out (uploaded): 0.5 KB 


PHP Code:

URL: https://secure.img-cdn.mediaplex.com/0/12309/207334/159284_us_cs_li_fy15q4w01_oa_Workstations-Engineering_300x250_iip-.swf
Host: secure.img-cdn.mediaplex.com
IP: 23.203.54.26
Location: Akamai
Error/Status Code: 200
Client Port: 59950
Start Offset: 3.010 s
Time to First Byte: 46 ms
Content Download: 35 ms
Bytes In (downloaded): 38.3 KB
Bytes Out (uploaded): 0.5 KB 


[asabet]

Originally Posted by Max Taxable

Here's two of the flash objects, they're present in every test I run and take up about 77kb.

[PHP]URL: http://ds.serving-sys.com/BurstingRes//Site-501/Type-2/21ca2a22-3446-40ed-a00d-e0f68b03fe79.swf
Host: ds.serving-sys.com...

I don't know what those are - maybe in one of the posts featured on the front page?

But please, let's keep this on the OP topic - whether the JS and CSS that are native to vB 4 can be defered and/or optimized in such as way as to speed page load. For all other ways to speed page load, we can have another thread.

[Max Taxable]

Originally Posted by asabet

But please, let's keep this on the OP topic - whether the JS and CSS that are native to vB 4 can be defered and/or optimized in such as way as to speed page load. For all other ways to speed page load, we can have another thread.

I've not seen you have these issues affecting pageload. Because they're not. But, you're convinced you need it. All I do is recommend what works for speed and optimization, every time it is tried.

I'll let others help chase the red herring now.

[asabet]

Thank you.

--------------- Added [DATE]1421187954[/DATE] at [TIME]1421187954[/TIME] ---------------

Originally Posted by Max Taxable

There's no indication of that at all, here.

http://www.webpagetest.org/result/150113_Y3_W40/

There aren't any delays in your waterfall. Everything is loading nicely, uninterrupted.

How about this:

[Max Taxable]

Originally Posted by asabet

How about this:

Answered over at Ozzy's place in same thread.

But for readers here, what you're seeing isn't interference with parallel downloads, and js files actually behave differently almost every time they're downloaded. Multiple tests - as I showed in the thread at Ozz, confirm this. Plus when you test with Chrome you don't get real-world results. I recommend IE 10 for all testing.


By the way your performance is much improved, congrats! A little common sense goes a long way.

http://www.webpagetest.org/result/150114_KK_3H2/

[asabet]

I think my graphic above speaks for itself unless someone can tell me why it only looks like lightbox.js is delaying onload.

[Max Taxable]

Originally Posted by asabet

I think my graphic above speaks for itself unless someone can tell me why it only looks like lightbox.js is delaying onload.

You are visually complete when it is finished downloading. Try several tests, see the lightbox load differently each time.

Cherry picking one out of how many tests wastes whose time exactly? "Your graphic" does not represent what's really happening.

Your site is greatly faster now. As fast as any v4 out there. You should wait for someone else to come along and harpoon your js and css red herrings, I don't have time for non problems.