{"id":2155,"date":"2016-08-02T08:47:40","date_gmt":"2016-08-02T08:47:40","guid":{"rendered":"http:\/\/www.majory-cubizolles.fr\/blog\/?p=2155"},"modified":"2017-01-23T18:23:24","modified_gmt":"2017-01-23T18:23:24","slug":"ameliorer-performances-de-boutique-astuce-prestashop","status":"publish","type":"post","link":"https:\/\/www.majory-cubizolles.fr\/blog\/ameliorer-performances-de-boutique-astuce-prestashop\/","title":{"rendered":"Am\u00e9liorer les performances de votre boutique Prestashop 1.6"},"content":{"rendered":"

A) Connaitre les performances de sa boutique Prestashop<\/span><\/h2>\n

Lorsqu’un internaute arrive sur votre site de vente en ligne\u00a0en g\u00e9n\u00e9ral il n’a pas la patience d’attendre le chargement d’une page.<\/p>\n

Par cons\u00e9quent, plus le temps de chargement est long, plus le taux d’abandon est important.<\/p>\n

Aujourd’hui, il existe de nombreux sites pour tester la \u00a0performances de son site ecommerce, en ce qui me concerne j’utilise ces deux la :<\/p>\n

1) Gtmetrix (voir le site<\/a>)<\/strong><\/h3>\n

\"Optimiser<\/a><\/p>\n

<\/p>\n

2) PageSpeed Insights de Google (voir le site<\/a>)<\/strong><\/h3>\n

\"Optimiser<\/p>\n

B)\u00a0R\u00e9glage des options de performance depuis le back-office Prestashop<\/span><\/h2>\n

Depuis le back-office de \u00a0Prestashop, allez dans l’onglet Param\u00e8tres Avanc\u00e9s > Performances<\/p>\n

a) R\u00e9glages de \u00a0Smarty<\/strong><\/span><\/h3>\n

Smarty est un syst\u00e8me de templates utilis\u00e9 par le cms Prestashop,\u00a0pour la gestion de vos templates. Malheureusement, il est gourmand en ressources, je vous conseille donc de configurer les param\u00e8tres comme ci-dessous\u00a0.<\/p>\n

\u2013 Cochez ne jamais \u00ab\u00a0Ne jamais recompiler les fichiers de templates.\u00a0\u00bb
\n\u2013 Cochez cache activ\u00e9 (permet la mise en cache des fichiers)<\/p>\n\n\n\n
En phase de d\u00e9veloppement, lorsque vous d\u00e9sirez modifier les fichiers TPL\/CSS\/JS, il faut cocher \u00ab\u00a0Recompiler les fichiers de templates s’ils ont \u00e9t\u00e9 mis \u00e0 jour\u00a0\u00bb pour que les modifications soient prises en compte.<\/strong><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

\"Am\u00e9liorer<\/a><\/p>\n

b) R\u00e9glages de CCC (Concat\u00e9nation, Compression et mise en Cache)<\/strong><\/span><\/h3>\n

Dans cette partie, il faut activer tous les onglets :<\/p>\n

Smart cache pour les feuilles de style : <\/strong>ce r\u00e9glage permet de r\u00e9unir l’ensemble des fichiers CSS en un seul fichier CSS\u00a0r\u00e9duisant ainsi le temps de chargement.<\/p>\n

Smart cache pour le code JavaScript :<\/strong> ce r\u00e9glage permet de r\u00e9unir l’ensemble des fichiers JS\u00a0en un seul fichier Javascript, r\u00e9duisant ainsi le temps de chargement.<\/p>\n

R\u00e9duction du code HTML : <\/strong>ce r\u00e9glage permet de r\u00e9duire tous les espaces inutiles \u00e0 l’int\u00e9rieur de vos fichiers TPL.<\/p>\n

Compression du JavaScript dans le code HTML : \u00a0<\/strong>principe identique que pour le\u00a0Smart cache pour le code JavaScript.<\/p>\n

Compression maximum du code HTML :<\/strong> ce r\u00e9glage permet de compresser au max les fichiers TPL<\/p>\n

D\u00e9placer le code Javascript \u00e0 la fin :<\/strong> ce r\u00e9glage permet de forcer le\u00a0chargement en dernier, ce qui permet \u00e0 votre page Web de charger les \u00e9l\u00e9ments les plus simples de votre site en premier.<\/p>\n

Optimisation apache :<\/strong> ce r\u00e9glage changera la configuration de votre serveur Web afin de le rendre plus efficace dans le cadre des options CCC.<\/p>\n\n\n\n
Attention, certains de ces r\u00e9glages peuvent entrainer des bugs sur votre th\u00e8me, une fois le CCC activ\u00e9, je vous invite \u00e0 tester votre site pour s’assurer que tout fonctionne correctement<\/strong><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

\"Am\u00e9liorer<\/a><\/p>\n

c) R\u00e9glages de Serveurs de m\u00e9dia (utilis\u00e9 uniquement lorsque CCC est activ\u00e9)<\/strong><\/span><\/h3>\n

Serveurs de m\u00e9dia connus aussi sous CDN signifie :\u00a0content delivery network. Il permet de dispatcher le chargement de vos diff\u00e9rents fichiers (images, css, javascript…..) sur plusieurs serveurs.<\/p>\n

L’id\u00e9e est de cr\u00e9er 3 sous-domaines afin que le chargement des images, css, js…. se r\u00e9partisse entre\u00a0les 3 sous-domaines.<\/p>\n

1) Depuis le back-office de votre h\u00e9bergement exemple 1&1, ovh, gandhi…. il vous faudra cr\u00e9er 3 sous-domaines qui pointeront au m\u00eame endroit que le domaine principal. .Exemple :<\/p>\n