Hello actually is anyone know how to make the merged js and css file load asynchronous in magento
i try add
<param>defer</param>
into
<action method="addItem"><type>skin_js</type><name>js/bundle.js</name><param>defer</param></action>
for every js file,
But it's not get any impact, actually where the best way to do this
and for css i try :
<script>
function loadCSS(href){
var ss = window.document.createElement('link'),
ref = window.document.getElementsByTagName('head')[0];
ss.rel = 'stylesheet';
ss.href = href;
// temporarily, set media to something non-matching to ensure it'll
// fetch without blocking render
ss.media = 'only x';
ref.parentNode.insertBefore(ss, ref);
setTimeout( function(){
// set media back to `all` so that the stylesheet applies once it loads
ss.media = 'all';
},0);
}
loadCss('things.css');
</script>
<noscript>
<!-- Let's not assume anything -->
<link rel="stylesheet" href="things.css">
</noscript>
but i'm not sure where to put this script since everything, i mean the js and css loaded by xml,
hope someone can figure this out
Cheers
Best Answer
cheers mate,
I'm using this post as a reference
PageSpeed - Eliminate render-blocking JavaScript and CSS in above-the-fold content
for each action I have two lines of code
original
edited
I've put the modifications in my page.xml file located in the theme folder of the theme I'm using
you also need to find if you have other xml files referencing to and modify accordingly
I've tested as written above and modified just the files in the page layout xml (in my case) just to see if after using google speed test the number the edited files do their work and it's fine!
cheers