T3 Video Tutorials

Basic and Advanced Joomla video tutorials about T3 Framework

Optimize CSS and JS in Joomla video tutorial

In this video tutorial, you will learn how to optimize CSS and JS that will improve your site performance. You can also exclude CSS and JS files for optimization.

Video Transcript:

Hi, I’m John from JoomlArt. And today we will talk about how to optimize CSS and JS.

Optimize CSS and JS improve your site performance by join and compress CSS and JS files so that the total size and number of requests is decreased dramatically.

Let’s check the list of the CSS files that load when it’s not optimized. You see, there are a lot of CSS files loaded in the page. Next check the JS, it’s loading many js files also.

Now we will see how magical T3 Framework is. Go to back-end template style manager, in the General tab, disable development mode then enable CSS and JS optimization options. For JS optimization, you can select compile tools: JSMIN or Closure Compiler.

Open the front-page again then reload. Now you see the differences? There are 3 JS files loading only and it’s the same with CSS. If you calculate, you see that the total sizes is decreased also.

You can exclude specific CSS and JS files to optimize, just add file name here, you can add path to the file to make sure it gets the right file. Separate multiple files with a comma, no space. Reload the front-page again. See? template.css and script.js are not optimized.

That’s it for today, for more video tutorials, please check more videos at: http://www.youtube.com/user/JoomlArt

Thanks for watching.