Board Optimization - vB4 SuperCharged - Optimises CSS, Javascript and HTML

This is designed for vBulletin 4.0.x only.

DO NOT INSTALL on vB 4.1.x or 4.2.x.

Even if it worked correctly, the effect is negligible as vB4 is nowhere near as terrible client-side speed-wise as it once was.

DO NOT ask for fixes, they will not come, I have moved to XenForo.


__________________________________________________ ______________


tl;dr - Significant frontend speed improvements for vBulletin 4

Don't forget to Mark as Installed if you use this mod, and a nomination for MOTM would be nice

__________________________________________________ ______________


Features:


CSS Optimiser: Minifies all CSS files and serves CSS directly, eliminating the PHP overhead from css.php.

Javascript Optimiser: Intelligently defers Javascript loading (puts script tags just before </body> on the fly) and combines common Javascript files. Also features optional compression with Google Closure Compiler.

HTML Optimiser: Based on HELLCAT's Realtime Page Compressor, and adds complete whitespace removal around block and meta elements and removal of unimportant comments.

Attachment Optimiser: Intended for FastCGI users only - serves attachment thumbnails and images directly rather than through PHP.

All this is done efficiently and on-the-fly - no need for any template edits.

__________________________________________________ ______________


Installation:

1. Ensure you have CSS stored on the filesystem and not your database. To check this, go to Settings > Options > Style & Language Settings > Store CSS Stylesheets as Files? and ensure it is set to "Yes".
2. Disable Remote YUI if you have it enabled. To check this, go to Settings > Options > Server Settings and Optimization Options > Use Remote YUI and ensure it is set to "None".
3. Upload the contents of vbsc.zip to your forum root directory via FTP.
4. Ensure the files vbsc.js and vbsc.js.gz in /clientscript/ are writable (chmod).
5. Install product-vbsc.xml as a Product. (Plugins & Products > Manage Products > Add/Import Product)
6. Run Compress Javascript and Compress CSS under the vB4: SuperCharged Admin CP section.
7. Check to ensure that all the settings are correct for your forum, as some of the optimisers are likely to conflict with other poorly coded mods, and not all are turned on by default (vB4: SuperCharged > Options).

__________________________________________________ ______________


Conflicts:

• If you wish to run vBSEO along with the Attachment Optimiser, you must disable Attachment Rewrites under URL Rewrite Settings > Forum URLs. This incompatibility is by design.
• If you run vBSEO's Cleanup HTML function, you should choose between it and vBSC's HTML Optimiser. Running both at once is a waste of resources and may create conflicts that would not otherwise exist.

__________________________________________________ ______________


Upgrading:

1. Upload the contents of vbsc.zip to your forum root via FTP. (Overwrite the existing files.)
2. Install the new product-vbsc.xml, ensuring you have Allow Overwrite set to Yes. (Plugins & Products > Manage Products > Add/Import Product)
3. Run Compress Javascript and Compress CSS under the vB4: SuperCharged Admin CP section.

__________________________________________________ ______________


Changelog:


1.51:

• A minor, optional update involving product-vbsc.xml only.
• Fixed conflict between vBSC, vBSEO and certain language/template customisations which prevented the PM notifications from opening a new window when requested.

1.5:

• Several changes made to various files - don't forget vbsc.zip when updating.
• The Javascript Optimiser will now function properly without the Common Javascript Cache enabled, for those of you more concerned about download size than http requests
• As I've found disabling the Common Javascript Cache can take 500ms off the rendering time in Firefox, it is no longer enabled by default.
• Fixed Facebook Connect.
• Fixed compatibility with certain types of Adsense ads
• Fixed loadvBCss inline javascript calls being incorrectly left alone, screwing up nested CMS Sections among other things.
• Fixed the removal of the space between "by" and the username in the last post column with the HTML optimiser enabled.
• Restored modification date check on vbsc.js

1.4:

• Several changes made to various files - don't forget vbsc.zip when updating.
• Google Closure Compiler appears to be working again, so you can re-enable that.
• Fixed error spam and even fatal errors when importing products, possibly at the expense of compatibility with YAFB, but who needs that now anyway?
• Improved inline Javascript regexes, fixing several VSa mods, and probably others too.
• Improved descriptions of some settings.
• HTML Optimiser is no longer on by default (it's pretty resource heavy and pointless).
• Fixed hard-coded /admincp/ reference in the CSS Auto-Compress hook.

1.3:

• Several changes made to vbsc.php - don't forget vbsc.zip when updating.
• Disable Google Closure Compiler if you have it enabled as it no longer works and I'm not sure why yet.
• The CSS optimiser now overwrites the existing CSS files with the minified equivalents, reducing the amount of regex guesswork needed.
• Fixed error appearing on the login page with the CSS optimiser enabled.
• Tested with [AJAX] - Advanced Forum Statistics

1.2:

• Changes made to various files - don't forget vbsc.zip when updating.
• Added Advanced Attachment Optimiser for img tags (skips attachment.php altogether rather than simply adding a redirect) and improved the original one (designed to be run together).
• The DIR constant is now used throughout vBSC.
• Fixed style00000 bug on redirect pages - now defaults to style id 1.
• Fixed strange bug in the CSS Optimiser where in some circumstances, css.php style URLs (with commas) would be used in direct links, breaking everything.
• Removed a pretty pointless check on the modification date of vbsc.js (due to issues). You'd have to be an idiot not to run compress css/js after updating vBulletin :P

1.1:

• Changes made to various files - don't forget vbsc.zip when updating.
• No longer works on vBulletin 4.0.0 - supports 4.0.1 only.
• Removed common css cache - vBulletin's new "-rollup" system only results in a couple of extra requests and less conflicts.
• Added support for new LTR/RTL vbulletin_css folders to all elements of the CSS Optimiser.
• Improved support for obscure ways of including CSS that some mods may use.
• Fixed unnecessary errors when some Javascript files are not present.
• The appropriate DIR constant is now used when including vbsc_global.php, hopefully fixing the invalid argument supplied for foreach() error.
• Fixed bug in Compress Javascript for forum-only vBulletin - file_get_contents(./clientscript/).
• Fixed CSS Optimiser incompatibility with Yay! Another Facebook Bridge, which for some reason breaks write_style_css_directory().
• CSS Optimiser now uses write_style_css_directory() rather than the full build_style() function.

1.01:

• Changes made to various files - don't forget vbsc.zip when updating.
• Fixed compatibility with child styles.
• Improved Javascript and CSS Optimiser error messages.

1.0:

• Changes made to various files - don't forget vbsc.zip when updating.
• Fixed bug in the Javascript Optimiser where the type attribute was required on a script tag - some mods leave this out or put it after src.
• The monolithic vbsc.js file is now optional, although enabled by default (under the setting Common Javascript Cache). Many people's problems seem to be related to it, and there isn't much difference without it, as long as the loading deferral is still there.
• The CSS files showthread.css, postbit-lite.css, postbit.css and forumdisplay.css are no longer included in the common CSS cache. This fixes a conflict with Abe1's Post Thank You Hack, along with other incompatibilities. The vBSC CSS hacks that were necessary due to conflicting rules in these files have also been removed.
• The CSS Files and JS Files settings, along with some other things, have been moved to includes/vbsc_global.php. Due to this, uninstalling before upgrading is no longer strictly necessary.
• Greatly improved the details given by the Javascript Optimiser fallback warning and steps to take to get it to disappear for people having issues.
• Fixed compatibility with the Forum-only version of vBulletin.
• Added some Blog files to the common Javascript cache.
• vBSC will now detect if you have the CMS or Blog products disabled and skip caching their Javascript files as necessary.
• Improved descriptions of admin settings.

0.92:

• Fixed bug in the JS Optimiser causing bits of HTML comments to be visible at the bottom of the page under certain circumstances.
• Worked around a stupid bug in Latest Posts and Newest Members on Forum Home which somehow doesn't occur during normal operation and only when the HTML is messed with by the HTML optimiser. In other words, not my fault

0.91:

• Fixed(?) rare issue where reCaptcha would fail to appear with JS Optimiser enabled.

0.9:

• Changes made to vbsc.php - don't forget vbsc.zip when updating.
• Added "vbseo" to the inline Javascript whitelist.
• Fixed compatibility with ibProArcade and any other mods which utilise the css_start hook to add additional CSS.
• Fixed message about Compress CSS always appearing on certain CMS pages. If the styleid from cms_node is not found, it defaults silently to the board default style, just as vBulletin itself does.
• Fixed compatibility with Flashchat 6 Integration and any other mod which uses shorthand css.php URLs.
• Fixed display of topic review with the CSS optimiser enabled.
• Fixed lack of spaces between usernames in various places.

0.82:

• Fixed specific issue where the domain name was included before the YUI reset-fonts.css url, causing it to end up included after vbsc.css and screw things up.

0.81:

• Fixed CSS optimiser not supporting style IDs of > 9.
• Fixed CSS optimiser not working on some redirection pages, especially after login.

0.8:

• Changes made to vbsc.php - don't forget vbsc.zip when updating.
• Added warning if CSS and/or Javascript are not cached correctly, and it now falls back to the normal CSS/JS rather than messing everything up if they aren't.
• Fixed user style selection not being considered with the CSS Optimiser enabled.
• Compress CSS now grabs the styles from the database and performs the equivalent rebuilding process to saving a stylevar automatically. This is likely to fix a lot of people's issues
• Added a whitelist of various vB-related terms to the inline Javascript optimiser, hopefully fixing issues with Google Custom Search and ad providers other than Google (which was previously blacklisted).
• Fixed broken posting permissions box on newthread/postreply with the CSS Optimiser enabled.
• Fixed automatic CSS compression 404'ing when running the vB upgrade script.
• Completely changed how automatic CSS compression is run, resulting in a smoother experience free of iframes. It also only runs once regardless of how many styles you have.
• Fixed incompatibility with BBR - Resize Images with lytebox, and probably other mods.
• Tested compatibility with GCBOS 0.6.10.

0.7:

• Changes made to vbsc.php - don't forget vbsc.zip when updating.
• Fixed CMS sections widget not working with JS Optimiser enabled. The fix for this will probably also fix other YUI-related issues.
• Fixed visitor messages being too wide with CSS Optimiser enabled.

0.6:

• Several changes made to vbsc.php - don't forget vbsc.zip when updating.
• Added a number of additional Javascript and CSS files - please uninstall vBSC before installing 0.6.
• Compress JS now makes a small modification to the actual code to workaround a bug which can break a lot of things (most notably inlinemod) and generally screw things up.
• Fixed links to compressed code in the admin cp.
• Fixed /clientscript/ -> clientscript/ in the JS optimiser.
• Closure Compiler is now optional, and defaults to off because it really provides little gain other than download size and takes ages to run. Standard JSMin is now the default form of compression.
• Added error messages for both compressors.
• Fixed vbulletin_textedit.js not being filtered out properly due to nearby HTML comments.
• Tested compatibility with GCBOS and additional_css mods.

0.5:

• Fixed any prefix to css.php not being removed properly and being displayed as text in the header.

0.4:

• Fixed references to /clientscript/ instead of clientscript/, which broke support for forums not running in the root of a domain.
• Fixed incompatibility with new css.php URLs in RC2.
• Fixed conditional comments around IE Javascript being removed.
• Fixed weird inlinemod issue.
• Added popuplist.css - please uninstall before upgrading or add this to your CSS Files list manually.
• Fixed incompatibility with Google Adsense. Fixes for other ad providers and other inline Javascript will be added on request.

0.3:

• Added HTML Optimiser
• Fixed @charset spam in vbsc.css
• Fixed vbsc_ files not being used due to a regression during release.
• cpnav_vbsc.xml was accidentally left out in 0.2 :P
• CSS is now automatically compressed when the files are updated through the StyleVar system, or otherwise. This also fixes the random deletion of vbsc.css and other vbsc_ css files.

0.2:

• Added JS optimiser

__________________________________________________ ______________

ONLY if you wish to use the Attachment Optimiser, something similar to this is needed in your server config (nginx):

location /customattachments {
   if ($request_uri ~* \.(png)) {
       add_header Content-Type image/png;
   }
   if ($request_uri ~* \.(jpg|jpeg)) {
       add_header Content-Type image/jpeg;
   }
   if ($request_uri ~* \.(gif)) {
       add_header Content-Type image/gif;
   }
}

(although some browsers will probably be happy enough without these headers)

[BSMedia]

My forum went from a 66/100 to a 70/100 after using this.

After some .htaccess work, I've got it up to an 80/100, going to try to see if I can get 100/100


Edit: 90/100 is probably as high as I'm going to go until I can see what the dev's have planned for optimization in their releases following gold.

[Darkimmortal]

I might have a go at tackling "Optimise images", "Specify image dimensions" and some of "Use efficient CSS selectors" in a later release

But for now I'm focused on getting fully deferred Javascript.

And I suppose "Parallelise downloads across hostnames" could be done fairly easily with some extra subdomains pointing at the root, along with some code to distribute downloads across them.



I dunno about 100/100, but ticks across the board in the Page Speed Firebug addon is good enough for me

[lord_of_chaos]

Hello,
nice add-on you have here, indeed.

Did I just over-read it or didn't you mention that the PHP / Webserver needs write access to "/clientscript/vbsc.js" and "/clientscript/vbsc.js.gz"? Took me some time to find that out. Could be added to the first post.

[BSMedia]

Originally Posted by Darkimmortal

And I suppose "Parallelise downloads across hostnames" could be done fairly easily with some extra subdomains pointing at the root, along with some code to distribute downloads across them.

That'll have to be done at the server level, I'm not sure any script or modification can handle it.

I setup mine last night in about 6 minutes. I made. Then in the image paths for StyleVars i just entered the full path (http://images1.site.com) and everything appears to be working.

images1.site.com (statusicons)
images2.site.com (gradients)
images3.site.com (site_icons)
images4.site.com (misc)
images5.site.com (images)
clientscript.site.com (clientscript)

Then I modified the headinclude template to point the clientscript call to http://clientscript.site.com/blahblah.js?V=whatever

Here is a quick guide on Setting up parallel hostnames for vBulletin optimization & vBulletin 4 optimized .htaccess for vBulletin optimization

[BSMedia]

There seems to be a bug with this mod and CMS sections.

When it's enabled the sections on the CMS don't appear.

When it's disabled, the CMS sections appear just fine.

[Darkimmortal]

Originally Posted by BSMedia

There seems to be a bug with this mod and CMS sections.

When it's enabled the sections on the CMS don't appear.

When it's disabled, the CMS sections appear just fine.

Can you give me a link to your site where that is happening?

[BSMedia]

Yeah

http://apertureforums.com

It's currently disabled, but I'll enable it for a while so you can see it in action.

[Darkimmortal]

I was able to reproduce the sections bug - it will be fixed in 0.7, which I'm holding off on releasing until after gold.

[cloferba]

Originally Posted by Darkimmortal

I was able to reproduce the sections bug - it will be fixed in 0.7, which I'm holding off on releasing until after gold.

this is today...not?

[Darkimmortal]

Yeah just give me a sec to install gold on my board to test things out :P