Poll: Do you like this guide?
You do not have permission to vote in this poll.
Yes
88.33%
106 88.33%
No
11.67%
14 11.67%
Total 120 vote(s) 100%
* You voted for this item. [Show Results]

[Tutorial] 10 Steps for Achieving the Maximum Possible Speed for Your MyBB Forum!
#24
(2011-05-05, 01:25 PM)Renegader Wrote: Step 3: Let your CSS files load before your JavaScript. According to Google, this is a simple yet efficient method to reduce load time. This allows JS and CSS files to download in parallel. To do this, find headerinclude in your template list (ungrouped template) and find '{$stylesheets}'. Cut that move it right to the top headerinclude.

Step 7: Minify JavaScript and CSS files. - Minifying JavaScript and CSS reduces the size of the files and will result in faster load times although reduces readability of the file. Click here to use the compressor. Paste each of your JavaScript files (one at a time) in the box and click 'compress'. Copy the new code and paste it over the current JavaScript file (in your cPanel). Repeat for CSS by going into your theme Stylesheets in your Admin CP but make sure to change the 'file type' under the code box on the website.

Step 8: Combine Prototype, General and popupmenu JavaScript Files. Combing JavaScript files into one will reduce the number of lookups and decrease loading time by only having to download one JavaScript file instead of 3. You can easily combine them by going into your cPanel and viewing each of the codes. Next, create a new text file called 'combined' or so. Copy the content of each of your JavaScript files and paste them under each. Once done, save the file as <anything>.js and upload into your cPanel. Next, go into your header include and delete the 3 lines that contain the JS file, leave prototype, and replace prototype.js with <anything>.js. This can also be done with editor.js and other JS files that aren't displayed globally.

I've combined all 3 javascript files (taken from MyBB 1.6.3) into one and minimzed it with yuicompressor 2.4.6
The result is attached. Download it and save it to /jscripts/mybb.js
Then open your template headerinclude and find:

<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/prototype.js?ver=1600"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/general.js?ver=1600"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/popup_menu.js?ver=1600"></script>
{$stylesheets}

Replace it with:

{$stylesheets}
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/mybb.js"></script>

This will save 2 http requests and 83 kB data transfer. Smile


Attached Files
.js   mybb.js (Size: 103.5 KB / Downloads: 209)
Reply


Messages In This Thread
RE: [Tutorial] 10 Steps for Achieving the Maximum Possible Speed for Your MyBB Forum! - by querschlaeger - 2011-05-12, 03:46 PM

Forum Jump:


Users browsing this thread: 1 Guest(s)