Topic: Better JavaScript-Handling (some code included)

The current version of Arras (1.5.0.1) seems to be pretty "dumb" when it comes to the JavaScript files. For example it loads the jQuery-UI and Cycle PlugIn-Files even if they aren't used at all.

I made a quick fix for this behavior but unfortunately I don't have the time to test it as much as it should be tested. If you make the following changes to some of the files, the jQuery UI-files are only loaded if a Tabbed Sidebar is used and the Cycle-PlugIn is only loaded if the Slideshow is activated in the settings.

It would probably be a good idea to modify new versions of Arras so it doesn't load stuff it doesn't need (and IMHO it really DOES matter if 50 KB of unused JS-files are loaded or if not...)

So here we go:

library\slideshow.php

replace

add_action('wp_footer', 'arras_add_slideshow_js');

with:

if (arras_get_option('enable_slideshow') && ( is_home() || is_front_page() )) {
    add_action('wp_footer', 'arras_add_slideshow_js');
}

header.php

replace

wp_enqueue_script('jquery-ui-tabs', null, array('jquery-ui-core', 'jquery'), null, false);

with:

if (is_active_widget('arras_tabbed_sidebar')) {
    wp_enqueue_script('jquery-ui-tabs', null, array('jquery-ui-core', 'jquery'), null, false); 
}

and replace

if ( is_home() || is_front_page() ) {
    wp_enqueue_script('jquery-cycle', get_template_directory_uri() . '/js/jquery.cycle.min.js', 'jquery', null, true);
}

with:
   

if (arras_get_option('enable_slideshow') && ( is_home() || is_front_page() )) {
    wp_enqueue_script('jquery-cycle', get_template_directory_uri() . '/js/jquery.cycle.min.js', 'jquery', null, true);
}

finally, replace:

wp_enqueue_script('jquery-ui-tabs', null, array('jquery-ui-core', 'jquery'), null, false);

with:

if (is_active_widget(false, false, 'arras_tabbed_sidebar')) { 
    wp_enqueue_script('jquery-ui-tabs', null, array('jquery-ui-core', 'jquery'), null, false); 
} 

js/header.js.php

Replace

$('.multi-sidebar').tabs();

with

<?php if (is_active_widget(false, false, 'arras_tabbed_sidebar')) { ?>
$('.multi-sidebar').tabs();
<?php } ?>

Thumbs up +2

Re: Better JavaScript-Handling (some code included)

Thank you VERY much for this. I'm actually looking for anything I can get my hands on to lower the request on my server. I love the theme but like you said it loads up a lot of stuff even when it's not used at all.

I know how to replace the original code with yours, but I'm not really that good at modifying stuff, don't even get me started on fixing errors.

So my question to you: Did you manage to test this any further and did you run into any problems at all? I'm really looking forward to use all your suggestions above, but I need to make sure they work properly first.

Thanks.

- The road to success is always under construction -

My main arras site: Numaga.com
Other Arras sites I have: Piccaz.com - DeStift.com - NumagaBabes.com (18+)

Re: Better JavaScript-Handling (some code included)

Can someone confirm these work? I'm really looking for ways to make arras load faster... I need to reduce the pageload for high traffic.

- The road to success is always under construction -

My main arras site: Numaga.com
Other Arras sites I have: Piccaz.com - DeStift.com - NumagaBabes.com (18+)

Re: Better JavaScript-Handling (some code included)

Confirmed to work! I got tired of waiting and tested it myself smile It took 35 KB of my page load, not loading 3 unnecessary scripts. I'm not using the slider or the sidebar tabs so I don't need any of those scripts to load. If you do use the slider and/or sidebar tabs I suggest you test it fully.

I do have 1 question though:

header.php

replace

wp_enqueue_script('jquery-ui-tabs', null, array('jquery-ui-core', 'jquery'), null, false);

with:

if (is_active_widget('arras_tabbed_sidebar')) {
    wp_enqueue_script('jquery-ui-tabs', null, array('jquery-ui-core', 'jquery'), null, false);
}

and

finally, replace:

wp_enqueue_script('jquery-ui-tabs', null, array('jquery-ui-core', 'jquery'), null, false);

with:

if (is_active_widget(false, false, 'arras_tabbed_sidebar')) {
    wp_enqueue_script('jquery-ui-tabs', null, array('jquery-ui-core', 'jquery'), null, false);
}

aren't you replacing the same line with something twice? I only did the first one, not sure what to do with your second suggestion for that same line. It worked for me anyway and right now I'm testing for errors. Didn't find any yet!

Last edited by numaga (2011-02-17 08:27:33)

- The road to success is always under construction -

My main arras site: Numaga.com
Other Arras sites I have: Piccaz.com - DeStift.com - NumagaBabes.com (18+)