XF 1.4 Optimize the order of styles and scripts + speed optizimation

Betclever

Well-known member
I'm trying to optimize the speed of the loading page and other things and I got a question regarding optimizing the order of styles and scripts.

I have checked my website with GT Metrix and got this under "optimize the order of styles and scripts":

The following inline script blocks were found in http://bet-clever.com/ between an external CSS file and another resource. To allow parallel downloading, move the inline script before the external CSS file, or after the next resource.

  • Inline script block #3
  • Inline script block #5


The following external CSS files were included after an external JavaScript file in http://bet-clever.com/. To ensure CSS files are downloaded in parallel, always include external CSS before external JavaScript.


Therefore, I did not understand what I have to do to improve this.
Which template shall I modify and can someone tell me what's need to be modified?

Another thing, to optimize the page speed, I have added this code "advised by GT Metrix" to my htacess file under public_html:

## EXPIRES CACHING ##
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg "access plus 1 year"
ExpiresByType image/jpeg "access plus 1 year"
ExpiresByType image/gif "access plus 1 year"
ExpiresByType image/png "access plus 1 year"
ExpiresByType text/css "access plus 1 month"
ExpiresByType application/pdf "access plus 1 month"
ExpiresByType text/x-javascript "access plus 1 month"
ExpiresByType application/x-shockwave-flash "access plus 1 month"
ExpiresByType image/x-icon "access plus 1 year"
ExpiresDefault "access plus 2 days"
</IfModule>
## EXPIRES CACHING ##

Is this enough cause I did not notify any change for the second thing and GT Metrix displays the same message as before so am I wrong with anything?

Thanks a lot for your contribution.
 
Looks like you've already moved the JavaScript into your <body> tags..

One thing you really need to fix though is your duplicate calls to Font Awesome.

You are inserting it five times, some on different versions too:

Line 19:
Code:
<link href="//netdna.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">

Line 20:
Code:
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">

Line 31:
Code:
 <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">

Line 65:
Code:
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">

Line 77:
Code:
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet">

You only need to insert it once (preferably the latest version) - check your style/add-ons to investigate what is causing this.
 
Looks like you've already moved the JavaScript into your <body> tags..

One thing you really need to fix though is your duplicate calls to Font Awesome.

You are inserting it five times, some on different versions too:

Line 19:
Code:
<link href="//netdna.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">

Line 20:
Code:
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">

Line 31:
Code:
 <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">

Line 65:
Code:
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">

Line 77:
Code:
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet">

You only need to insert it once (preferably the latest version) - check your style/add-ons to investigate what is causing this.

Will do but where are these lines, I mean in which templates?

I have checked under forum_list, page_container and continue but I don't know where shall I search them...

Regards,
 
Font Awesome is not part of the default XenForo install (except if you use XenForo Media Gallery). Your style and/or add-ons are including those in the templates... you will need to search the templates to find out which ones are doing that.

Many add-ons have an option to disable Font Awesome include to address this.
 
Top Bottom