Go Back   vb.org Archive > vBulletin Article Depository > Read An Article > General Articles
FAQ Community Calendar Today's Posts Search

Reply
 
Thread Tools
Improve Web Page Performance
Princeton's Avatar
Princeton
Join Date: Nov 2001
Posts: 6,693

Joe Velez began developing for the web in 1998. He is an avid vBulletin user and volunteers his services as a vbulletin.org administrator. He currently spends his time maintaining and developing allnurses.com.

Vineland, NJ
Show Printable Version Email this Page Subscription
Princeton Princeton is offline 09-14-2009, 10:00 PM

Competition is increasing on the Web. If your site is slow you will lose to your competitors. To improve web page performance (speed), you can do a number of things:
  1. increase number of servers
  2. tweak your server(s)
  3. modify your web pages
This article will focus on modifying your web pages to increase performance.

As you are aware, today's browsers are faster than earlier versions. They have changed functionality to help improve speed. By understanding how browsers function, you will be able to increase your web page performance.

Learn everything that you can about browser functionality....
http://www.browserscope.org/ is a great resource that charts how different browsers function.

The Easiest Thing You Can Do To Improve Web Page Performance:
  1. Use less <tables> - if a product requires you to wrap large chunks of code within a <table> you should think twice about it
  2. Remove unnecessary objects, features, and plugins.
  3. Reuse static files across multiple domains. eg. images, css, js, etc
  4. Use less javascript - if a product requires additional javascript you should think twice about it; javascript blocks everything from loading (in parallel) until completely loaded and processed
Javascript blocks other files from downloading - It also needs time from processing. So, the less you have the faster your speed.



Read more about how <tables> affect speed...
How Design Affects Performance : Progressive Rendering

Additional information...
How Design Affects Performance

Increase Download Parallelization - Use A CDN Such As Amazon S3:

Increase download parallelization by increasing the number of resources that serves static files. In other words, if you have many static objects* on a page split them across multiple domains.

*static files - includes stylesheets, images, swf, etc

The reason why this works is because each browser allows a maximum number of connections per hostname. In modern browsers, this number has increased to 6 (avg). What this means is that your browser will try to download 6 objects from any hostname at the same time. So if you increase the number of resources that serve static files it's more likely that you will decrease page display time.

In comparison, older browsers such as IE 6 only allowed 2 maximum connections per hostname.

Move all your static files to a CDN such as Amazon S3. Doing so will provide you with the following:
  1. decrease server load
  2. decrease bandwidth
  3. decrease cost
  4. decrease page display time
Get yourself an S3 account ASAP!

I recommend using a different domain other than your site domain. The reason behind this is that you don't want your cookies associated with each static file.
  1. There's no need to associate cookies with static files.
  2. Some cookies can be as long as 1k which will increase your time.
the following image is a snapshot of the headers of a downloaded image...



Getting Started

I elect to use .info domain for static files as they are offered on the cheap - $1.99.

For example, if your site domain is domain.com ; you should purchase domain-file.info to serve your static files.

(Note: It can be any domain just as long as it's different from your site.)

Setting Up Your Domain

Once you get your domain you can point it to your amazon s3 server account (url). This is done by adding a CNAME entry for each sub-domain that you want to create.

I created the following sub-domains:
  • js.domain-file.info to serve javascript files
  • css.domain-file.info to serve stylesheets
  • img.domain-file.info to serve images
  • img2.domain-file.info to serve images
  • icons.domain-file.info to serve icons if you have a large amount of icons
To upload files, I highly recommend using a commercial product called Bucket Explorer. There is a free Firefox extension, S3Fox Organizer, that provides a GUI interface but it lacks a lot of features.

Whatever you use - make sure that you can alter headers.

You will need to add EXPIRES header so that the static files are cached - saving you bandwidth and decreasing overall page display time.

Other Things You Can Do To Speed Up Your Pages (in no particular order):
  • combine javascript (to decrease http request)
  • move javascript to the <head> or to the footer (below any content)
  • decrease number of inline javascript
  • combine css (to decrease http request)
  • combine images using sprites (to decrease http request)
  • load css prior to any javascript calls
  • compress images
Compress Javascript & Stylesheets:

To further decrease page display time, I recommend compressing (gzip) your js and css files. You will then have to create a plugin to show the gzip version if browser is capable of displaying if not show the uncompressed version.

Most modern browsers are capable of displaying compressed files. However, IE6 is known to have some issues - yes, even the SP2 which was reported to have this fixed is still buggy.

Tools To Help You Get Started
Reply With Quote
  #22  
Old 05-13-2010, 11:54 PM
Sparrow-Sean Sparrow-Sean is offline
 
Join Date: May 2010
Location: Canberra
Posts: 26
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Thanks for the tools Princeton,

Seeems I have some work to do!
http://forums.speedysparrow.com/show...&p=208#post208
Reply With Quote
  #23  
Old 07-07-2010, 06:42 PM
doraj doraj is offline
 
Join Date: Nov 2005
Location: Italy
Posts: 108
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Hello, 2 questions please:

1) When you say to compress javascript, so you suggest to use some online javascript compressoor, compress all javascript vBulletin and then upload and overwrite they?
Or compress javascript only using Gzip?

2) If I use Amazon S3, very interesting service, than is possible store for example, all the images and the skin on my forum?

Thank, How you have configured vBulletin to work and use that store images, attachments, javascript, on a different server automatically?

Thanks
Reply With Quote
  #24  
Old 07-28-2010, 11:32 AM
Hornstar Hornstar is offline
 
Join Date: Jun 2005
Location: Australia
Posts: 2,469
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

In Amazon S3 how do you "add EXPIRES header"?
Reply With Quote
  #25  
Old 07-28-2010, 03:46 PM
LuisManson LuisManson is offline
 
Join Date: Jun 2010
Posts: 115
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

maybe this can help http://www.bucketexplorer.com/
Reply With Quote
  #26  
Old 07-28-2010, 08:49 PM
Hornstar Hornstar is offline
 
Join Date: Jun 2005
Location: Australia
Posts: 2,469
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Oh yeah I should have been more detailed. What is the Value I need to use to make it expire in 1 month?
Reply With Quote
  #27  
Old 06-08-2011, 03:17 AM
Hareth Hareth is offline
 
Join Date: Dec 2007
Posts: 49
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

great work, I've done almost all

we need to know more about css sprites with (vBulletin)
Reply With Quote
  #28  
Old 05-22-2013, 11:11 AM
joeychgo's Avatar
joeychgo joeychgo is offline
 
Join Date: Mar 2004
Location: Chicago, IL
Posts: 933
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Would be nice if this was updated for 2013 / vb 4.21
Reply With Quote
  #29  
Old 05-22-2013, 03:15 PM
final kaoss final kaoss is offline
 
Join Date: Apr 2006
Posts: 1,314
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Most of this stuff is covered in my guide.
Quote:
Originally Posted by joeychgo View Post
Would be nice if this was updated for 2013 / vb 4.21
Reply With Quote
  #30  
Old 07-21-2015, 03:25 PM
friendlymela's Avatar
friendlymela friendlymela is offline
 
Join Date: Dec 2012
Location: Karachi, Pakistan
Posts: 272
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

wonderful tips well may i know how i can reduce server load in shared hosting?
Reply With Quote
  #31  
Old 09-23-2016, 11:50 AM
marysnow786 marysnow786 is offline
 
Join Date: Nov 2013
Location: Denmark
Posts: 38
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

use CDN / Caching software on server side / remove unnecessary plugins and modules. optimize images
Reply With Quote
Reply


Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 03:08 AM.


Powered by vBulletin® Version 3.8.12 by vBS
Copyright ©2000 - 2024, vBulletin Solutions Inc.
X vBulletin 3.8.12 by vBS Debug Information
  • Page Generation 0.04637 seconds
  • Memory Usage 2,305KB
  • Queries Executed 25 (?)
More Information
Template Usage:
  • (1)SHOWTHREAD
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_header_end
  • (1)ad_header_logo
  • (1)ad_navbar_below
  • (1)ad_showthread_beforeqr
  • (1)bbcode_quote
  • (1)footer
  • (1)forumjump
  • (1)forumrules
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (1)modsystem_article
  • (1)navbar
  • (4)navbar_link
  • (120)option
  • (1)pagenav
  • (1)pagenav_curpage
  • (2)pagenav_pagelink
  • (11)post_thanks_box
  • (11)post_thanks_button
  • (1)post_thanks_javascript
  • (1)post_thanks_navbar_search
  • (11)post_thanks_postbit_info
  • (10)postbit
  • (11)postbit_onlinestatus
  • (11)postbit_wrapper
  • (1)spacer_close
  • (1)spacer_open
  • (1)tagbit_wrapper 

Phrase Groups Available:
  • global
  • inlinemod
  • postbit
  • posting
  • reputationlevel
  • showthread
Included Files:
  • ./showthread.php
  • ./global.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/class_hook.php
  • ./includes/modsystem_functions.php
  • ./includes/functions_bigthree.php
  • ./includes/class_postbit.php
  • ./includes/class_bbcode.php
  • ./includes/functions_reputation.php
  • ./includes/functions_post_thanks.php 

Hooks Called:
  • init_startup
  • init_startup_session_setup_start
  • init_startup_session_setup_complete
  • cache_permissions
  • fetch_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • style_fetch
  • cache_templates
  • global_start
  • parse_templates
  • global_setup_complete
  • showthread_start
  • showthread_getinfo
  • forumjump
  • showthread_post_start
  • showthread_query_postids
  • showthread_query
  • bbcode_fetch_tags
  • bbcode_create
  • showthread_postbit_create
  • postbit_factory
  • postbit_display_start
  • post_thanks_function_post_thanks_off_start
  • post_thanks_function_post_thanks_off_end
  • post_thanks_function_fetch_thanks_start
  • post_thanks_function_fetch_thanks_end
  • post_thanks_function_thanked_already_start
  • post_thanks_function_thanked_already_end
  • fetch_musername
  • postbit_imicons
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • postbit_display_complete
  • post_thanks_function_can_thank_this_post_start
  • pagenav_page
  • pagenav_complete
  • tag_fetchbit_complete
  • forumrules
  • navbits
  • navbits_complete
  • showthread_complete