Magento eliminate render-blocking JavaScript

Defer loading of javascript can significantly decrease the page load of your Magento store. Magento uses a lot of javascript and the browser will wait for this javascript to completely download before it renders the page. Now, the Magento Minify Javascript / CSS can eliminate render-blocking javascript.

Site Optimizer already will increase your site speed by minifying javascript / css / html and merging your js / css and even optimizing your images and putting forever expiries on your resources. Javascript deferred loading is the next step to fully optimize your store speed. Our deferred loading technology will work out-of-the-box with all of our Magento extensions and default magento. It will also work with many 3rd party extensions without any modifications.

In addition to javascript deferment we have updated the Site Optimizer with other under-the-hood improvements such as optimizing media images that are inside of cms pages and static block content.


Quick Extension Overview

Speed up your site, improve your search engine site rankings and conversion rate, and improve your user experience in the process. Minify Js / CSS extension reduces page size, bandwidth, request count, and server load without anything more than installing this easy to use and feature-full extension.


 

Performance of Merging Javascript / CSS in Magento

Minify-Js--Css-(Web)Summary: Built-in merging of Javascript / CSS will slow down your store. You need Magento Minify Javascript / Css to properly merge files

Many store owners are enabling Javascript / CSS merging in Magento in order to “increase performance”. You can go to System -> Developer and look under Javascript and CSS Settings to see if your store is currently merging Javascript / CSS. If you have enabled merging, then we recommend that you disable this setting now. If you need proper merging, then you should purchase Minify JS / CSS.

Why is built-in merging of Javascript / CSS bad?

It breaks the browser cache. Merging is not done in an intelligent way. It is done too aggressively as all files are merged into one css and one javascript file. This is effective one a single page, but is not effective for a site as complex as Magento. As your customers change page types (home page -> catalog page -> product page) then it will generate new merged URLs which breaks the browser cache and causes the redownloading of all your CSS / JS files.

Why does the default merging generate different URLs for different page types?

Different page types have different CSS / Javascript requirements. Your home page may include 10 javascript files while your catalog page might include 12 javascript files. As a consequence, the merge URL for the 10 file merge will be different than for the 12 file merge.

Does this mean it is better to disable merging?

Yes, your site will be faster if you disable merging. Alternatively, you can use Minify JS / CSS for Magento, which merges intelligently. Your Google Page Speed will decrease if you disable merging and do not use Site Optimizer. However, Google Page Speed only measures page speed. It does not measure site speed. An individually loaded page will be faster with merging enabled, but your entire site will be slower. So, if your customers visit more than one page, you want to disable merging.

Is there a way to verify merging is done properly or not?

Yes, go to the home page of your site and record all javascript / css urls. Then, do the same for a catalog page and a product page. Next, verify that the urls are all the same if the same content is shown. With default merging enabled, you will notice different urls and when you go to the urls you will notice that 90% of the javascript / css is duplicated among the different urls.


Quick Extension Overview

Speed up your site, improve your search engine site rankings and conversion rate, and improve your user experience in the process. Minify Js / CSS extension reduces page size, bandwidth, request count, and server load without anything more than installing this easy to use and feature-full extension.