X-Cart forums

[MAPerformance Admin]

So we've been having some serious problems with site speed in Google Analytics, and their top suggestions to fix this are to remove render blocking resources.

The majority if their suggested fixes involve jQueryUI calls, which appear in /skin/common_files/jquery_ui.tpl

{load_defer file="http://code.jquery.com/jquery-1.4.2.js" type="js"}
{load_defer file="lib/jqueryui/jquery.ui.core.min.js" type="js"}
{load_defer file="lib/jqueryui/jquery.ui.widget.min.js" type="js"}
{load_defer file="lib/jqueryui/jquery.ui.position.min.js" type="js"}
{load_defer file="lib/jqueryui/jquery.ui.mouse.min.js" type="js"}
{load_defer file="lib/jqueryui/jquery.ui.button.min.js" type="js"}
{load_defer file="lib/jqueryui/jquery.ui.dialog.min.js" type="js"}
{load_defer file="lib/jqueryui/jquery.ui.resizable.min.js" type="js"}
{load_defer file="lib/jqueryui/jquery.ui.draggable.min.js" type="js"}
{load_defer file="lib/jqueryui/jquery.ui.tabs.min.js" type="js"}
{load_defer file="lib/jqueryui/jquery.ui.datepicker.min.js" type="js"}
{load_defer file="lib/jqueryui/jquery.ui.effects.min.js" type="js"}

which itself is loaded in /skin/common_files/meta.tpl

{include file="jquery_ui.tpl"}

Along with other resources mentioned by Google

{load_defer file="js/ajax.js" type="js"}
{load_defer file="js/popup_open.js" type="js"}
{load_defer file="lib/jquery.blockUI.js" type="js"}
{load_defer file="lib/jquery.blockUI.defaults.js" type="js"}

I was under the impression that the whole load_defer thing was supposed to "fix" this, but apparently it doesn't. What do we need to do to prevent these items from slowing our site down without breaking something?

[Jon]

The javascript is deferred twice in the code, once in the header, once in the footer. The majority of javascript is placed in the header, and even when deferred loads in the head before the site content. Much of the javascript can be moved to the footer but some of it is necessary in the header because it's used in the content of the page. Trick is to either:

a) determine what is and isn't needed in the head and move it to the footer

2) determine what is needed in the content of your site and recode it so all javascript can be moved to the footer

Neither one is an easy task.