Increasing page speed

[samdrp]

Hi all,

 

I just did a test for my site using gtmetrix and it gave me some critical errors (see below) but since I am new to all this and trying to work my way through any suggestions would be greatly appreciated. I am still learning prestashop so please be kind.

 

The theme we choose has turned out to be not the best choice but too late to go back now. I have contacted the theme developer but after 3 days now response.

 

Specify Image dimensions

Specifying a width and height for all images allows for faster rendering by eliminating the need for unnecessary reflows and repaints.

 

Leverage browser caching

Reduce the load times of pages by storing commonly used files from your website on your visitors browser.

 

Combine images using CSS sprites

Combining images into as few files as possible using CSS sprites reduces the number of round-trips and delays in downloading other resources, reduces request overhead, and can reduce the total number of bytes downloaded by a web page. Specific images were given in the list

• http://www.designtrade.net/modules/agileblocktopmenu/img/arrows-ffffff.png
• http://www.designtrade.net/modules/agilemembership/images/membership_icon.png
• http://www.designtrade.net/modules/agilemultipleseller/images/myselleraccount.gif
• http://www.designtrade.net/themes/DT13/img/closeup.png
• http://www.designtrade.net/themes/DT13/img/icon/cart.png
• http://www.designtrade.net/themes/DT13/img/icon/login.png
• http://www.designtrade.net/themes/DT13/img/social/facebook.png
• http://www.designtrade.net/themes/DT13/img/social/rss.png
• http://www.designtrade.net/themes/DT13/img/social/twitter.png
•  

 

[Whispar1]

Analyzing GTMetrix can drive you nuts! I gave up but my site still loads fairly quick

Page load time: 2.83s
Total page size: 1.28MB
Total number of requests: 72

 

 

There are some things you can do and some you can not. For instance, if you have a responsive theme, you may not have image dimensions because they will change as the theme switches to mobile or tablet view. Try adding this to your .htaccess file - it should help. Add this AFTER the line:

# ~~end~~ Do not remove this comment, Prestashop will keep automatically the code outside this comment when .htaccess will be generated again

...otherwise Prestashop will over-write it the next time it generates the .htaccess file.

#Enable gzip
<IfModule mod_deflate.c>
        SetOutputFilter DEFLATE
        AddOutputFilterByType DEFLATE text/html text/plain text/xml text/css text/javascript
        AddOutputFilterByType DEFLATE application/xml application/xhtml+xml application/rss+xml
        AddOutputFilterByType DEFLATE application/javascript application/x-javascript
        AddOutputFilterByType DEFLATE application/x-httpd-php
</IfModule>

<IfModule mod_expires.c>
	ExpiresActive On
	ExpiresByType image/gif "access plus 1 month"
	ExpiresByType image/jpeg "access plus 1 month"
	ExpiresByType image/png "access plus 1 month"
	ExpiresByType text/css "access plus 1 week"
	ExpiresByType text/javascript "access plus 1 week"
	ExpiresByType application/javascript "access plus 1 week"
	ExpiresByType application/x-javascript "access plus 1 week"
	ExpiresByType image/x-icon "access plus 1 year"
</IfModule>

FileETag INode MTime Size
<IfModule mod_deflate.c>
	AddOutputFilterByType DEFLATE text/html
	AddOutputFilterByType DEFLATE text/css
	AddOutputFilterByType DEFLATE text/javascript
	AddOutputFilterByType DEFLATE application/javascript
	AddOutputFilterByType DEFLATE application/x-javascript
</IfModule>

<IfModule mod_headers.c>
    Header set Connection keep-alive
</IfModule>

Make a backup of your file first!!!! In case something goes wrong.

Retest and see where it gets you.

Edited May 2, 2014 by Whispar1 (see edit history)

[PrestaHeroes USA]

http://www.prestashop.com/forums/topic/314461-module-javapro-prestashop-15x-performance-significantly-speed-up-your-shop-pages/

 

there are also 'other' modules that address static page serve, but not at JavaScript level.

[Whispar1]

El Patron's module is one that addresses things most of us can not do. Very good solution!

[samdrp]

Thanks Whispar are you talking about the .htaccess file in the theme folder?

[PrestaHeroes USA]

Thanks Whispar are you talking about the .htaccess file in the theme folder?

 

yes, in the .htaccess, place per Whispar's instrucitons, or I have module for that to..jajajaja  http://www.prestashop.com/forums/topic/213570-module-prestashop-back-office-customize-apache-htaccess/

 

for manually updating /htaccess with custom directives, see this tip: http://www.prestashop.com/forums/topic/2131[spam-filter]tip-15-16-and-custom-htaccess/

[PrestaHeroes USA]

here is some easy ways to tune your existing shop from the back office

 

back office-->advanced parms-->performance

 

The following screen shot is from 1.5.6.2 (we don't know your version).

 

These are optimal values.  Note: you do not have optimal values currently set. 

 

Turn on one at a time, test your front office after enabling one(1) feature before enabling another

 

 

http://screencast.com/t/z41DFvKE7uDa

 

Once you have taken care of these then you can look for solutions that really put some giddy up in 'above the fold' page render, which your metrics do not test.

[samdrp]

Thanks so much for all the advice and will also check out your module

[samdrp]

To ElPatron

In the thread you mentioned 2 modules. Are you suggesting I need both?

[PrestaHeroes USA]

To ElPatron

In the thread you mentioned 2 modules. Are you suggesting I need both?

 

Just the JavaPro.

Module PrestaShop Topic: http://www.prestashop.com/forums/topic/314461-module-javapro-prestashop-15x-performance-significantly-speed-up-your-shop-pages/

 

Module home: http://www.etiendas.co/en/54-reduce-page-render-time-javapro.html

 

 

This solution will significantly speed up 'above the fold' page render, i.e. what you visitor sees for each landing page.

 

 

Review here other community members comments.

[PrestaHeroes USA]

Analyzing GTMetrix can drive you nuts! I gave up but my site still loads fairly quick

Page load time: 2.83s

Total page size: 1.28MB

Total number of requests: 72

 

 

There are some things you can do and some you can not. For instance, if you have a responsive theme, you may not have image dimensions because they will change as the theme switches to mobile or tablet view. Try adding this to your .htaccess file - it should help. Add this AFTER the line:

# ~~end~~ Do not remove this comment, Prestashop will keep automatically the code outside this comment when .htaccess will be generated again

...otherwise Prestashop will over-write it the next time it generates the .htaccess file.

#Enable gzip
<IfModule mod_deflate.c>
        SetOutputFilter DEFLATE
        AddOutputFilterByType DEFLATE text/html text/plain text/xml text/css text/javascript
        AddOutputFilterByType DEFLATE application/xml application/xhtml+xml application/rss+xml
        AddOutputFilterByType DEFLATE application/javascript application/x-javascript
        AddOutputFilterByType DEFLATE application/x-httpd-php
</IfModule>

<IfModule mod_expires.c>
	ExpiresActive On
	ExpiresByType image/gif "access plus 1 month"
	ExpiresByType image/jpeg "access plus 1 month"
	ExpiresByType image/png "access plus 1 month"
	ExpiresByType text/css "access plus 1 week"
	ExpiresByType text/javascript "access plus 1 week"
	ExpiresByType application/javascript "access plus 1 week"
	ExpiresByType application/x-javascript "access plus 1 week"
	ExpiresByType image/x-icon "access plus 1 year"
</IfModule>

FileETag INode MTime Size
<IfModule mod_deflate.c>
	AddOutputFilterByType DEFLATE text/html
	AddOutputFilterByType DEFLATE text/css
	AddOutputFilterByType DEFLATE text/javascript
	AddOutputFilterByType DEFLATE application/javascript
	AddOutputFilterByType DEFLATE application/x-javascript
</IfModule>

<IfModule mod_headers.c>
    Header set Connection keep-alive
</IfModule>

Make a backup of your file first!!!! In case something goes wrong.

Retest and see where it gets you.

 

also make sure to follow this great advice.  I didn't review it but I am sure whispars is running this in production shop.  not all apache directives work the same on all situations but having a tuned .htaccess deflate/expires/keep-alive is good practice.

[fishordog]

Analyzing GTMetrix can drive you nuts! I gave up but my site still loads fairly quick

Page load time: 2.83s

Total page size: 1.28MB

Total number of requests: 72

 

 

There are some things you can do and some you can not. For instance, if you have a responsive theme, you may not have image dimensions because they will change as the theme switches to mobile or tablet view. Try adding this to your .htaccess file - it should help. Add this AFTER the line:

# ~~end~~ Do not remove this comment, Prestashop will keep automatically the code outside this comment when .htaccess will be generated again

...otherwise Prestashop will over-write it the next time it generates the .htaccess file.

#Enable gzip
<IfModule mod_deflate.c>
        SetOutputFilter DEFLATE
        AddOutputFilterByType DEFLATE text/html text/plain text/xml text/css text/javascript
        AddOutputFilterByType DEFLATE application/xml application/xhtml+xml application/rss+xml
        AddOutputFilterByType DEFLATE application/javascript application/x-javascript
        AddOutputFilterByType DEFLATE application/x-httpd-php
</IfModule>

<IfModule mod_expires.c>
	ExpiresActive On
	ExpiresByType image/gif "access plus 1 month"
	ExpiresByType image/jpeg "access plus 1 month"
	ExpiresByType image/png "access plus 1 month"
	ExpiresByType text/css "access plus 1 week"
	ExpiresByType text/javascript "access plus 1 week"
	ExpiresByType application/javascript "access plus 1 week"
	ExpiresByType application/x-javascript "access plus 1 week"
	ExpiresByType image/x-icon "access plus 1 year"
</IfModule>

FileETag INode MTime Size
<IfModule mod_deflate.c>
	AddOutputFilterByType DEFLATE text/html
	AddOutputFilterByType DEFLATE text/css
	AddOutputFilterByType DEFLATE text/javascript
	AddOutputFilterByType DEFLATE application/javascript
	AddOutputFilterByType DEFLATE application/x-javascript
</IfModule>

<IfModule mod_headers.c>
    Header set Connection keep-alive
</IfModule>

Make a backup of your file first!!!! In case something goes wrong.

Retest and see where it gets you.

 

Any idea why it still gives me F grade for Specify image dimensions? i have all this in my htaccess file already

[Whispar1]

It does that by default. I really think you are over-stressing on the image dimensions because the work involved to change that, especially wit a responsive theme it a LOT of work for very little gain. What is important is what your customers see. None of your customers are going to go to gtmetrix and test your site before making a purchase. Making sure your .htaccess file is written correctly and ElPatron's module is a better and faster option for what your customer will experience.