Conseils sur l'optimisation de la vitesse du site, par où commencer?

On m'a demandé d'essayer de trouver une solution pour le temps de chargement lent de notre site Magento. J'ai passé un test Yslow et les plus grands délinquants semblent être

• Faire moins de requêtes HTTP
• Utilisez un CDN
• Ajouter des en-têtes expirés
• Mettez Javascript en bas
• Réduisez jS et CSS
• Configurer les balises ET
• Réduisez les recherches DNS
• Évitez le filtre AlphaImageLoader

En tant que responsable du commerce électronique, je recherche des conseils sur ce que je peux faire de mon rôle au sein de l'administrateur Magento, des outils pour les webmasters, etc. et sur ce que je peux demander à un développeur de faire pour que notre site soit conforme et sensiblement plus rapide.

J'ai également regardé un plugin appelé GTMetrix qui semble faire beaucoup de choses pour vous au sein de l'administrateur (combiner des feuilles CSS, optimiser des images, etc.), quelqu'un a-t-il une expérience avec cela? J'essaie généralement d'éviter trop d'extensions qui atteignent si profondément les fonctions essentielles, mais cela pourrait être une solution. http://gtmetrix.com/magento-optimization-guide.html

Vos conseils seraient très appréciés, car j'ai du mal à savoir par où commencer pour avoir le meilleur impact.

Merci d'avance.

(copié depuis mon propre blog à https://www.gui.do/post/101-ways-to-speed-up-your-magento-e-commerce-website )

A) Environnement d'hébergement / Conseils généraux

1. Obtenez un serveur dédié.
2. Hébergez votre site dans le pays où se trouvent vos clients.
3. N'hébergez pas sur votre serveur Web des fichiers que vous n'utilisez pas, grands ou petits.
4. Allez à MySQL Admin et sélectionnez toutes les tables et réparez puis optimisez-les.
5. Utilisez un accélérateur PHP comme APC, ZendOptimizer + ou Xcache.
   • APC - http://pecl.php.net/package/APC . Augmentation de APC.shm.size à quelque chose comme 128 pour permettre à plus de données d'être mises en cache par apc.
   • Xcache - http://xcache.lighttpd.net/
6. Installez uniquement les modules Apache nécessaires.
7. Utilisez Apache mod_expires et assurez-vous de définir la durée de mise en cache des fichiers. Vous pouvez utiliser l'exemple ci-dessous pour votre configuration Apache virtualhost: # Activer Expires et définir la valeur par défaut sur 0 ExpiresActive On ExpiresDefault A0 # Configurer la mise en cache des fichiers multimédias pendant 1 an (pour toujours?) ExpiresDefault A29030400 En-tête ajouter Cache-Control "public" # Configurer la mise en cache sur les fichiers multimédias pendant 2 semaines ExpiresDefault A1209600 En-tête ajouter Cache-Control "public" # Configurer la mise en cache d'une semaine sur les fichiers fréquemment mis à jour ExpiresDefault A604800 En-tête ajouter Cache-Control "proxy-revalidate"
8. Activez la compression Gzip dans htaccess .
9. Compressez la sortie, utilisez zlib.output_compression ou mod_deflate.
10. Utilisez un réseau de distribution de contenu (CDN) pour le transfert parallèle de contenu statique. Il existe une extension Magento qui peut vous aider à le faire avec les images de catégorie et de produit: le CDN d'image One Pica . Mais ... (voir astuce suivante).
11. N'utilisez pas trop de sources externes différentes (pour les images, les iframes, les flux (twitter / facebook), etc.) car chaque recherche DNS prend plus de temps et vous créez une dépendance supplémentaire (sur un serveur tiers) pour que votre site se charge correctement .
12. Activer Apache KeepAlives: assurez-vous que KeepAlives est activé dans votre configuration Apache. KeepAlives est une astuce où plusieurs requêtes HTTP peuvent être acheminées via une seule connexion TCP. La configuration de chaque connexion TCP entraîne un temps supplémentaire, ce qui peut réduire considérablement le temps de téléchargement de tous les fichiers (HTML, JavaScript, images) pour un site Web. Plus d'informations sur Apache.org . Attention cependant, certains m'ont dit que cela créait (beaucoup) de charge supplémentaire sur le serveur et pouvait planter le serveur lors des moments de forte circulation!
13. Minimisez les redirections.
14. Rendez votre sortie conforme au W3C. Les erreurs ralentissent le navigateur.
15. Échangez Apache pour NginX ou Litespeed. Si ce n'est pas une option, optez pour Zend Server (idéalement la version non-CE afin que vous puissiez utiliser la mise en cache pleine page).
16. Désactivez ou réduisez au moins la journalisation du serveur Web (réduit les écritures sur disque).
    • Désactivez la journalisation du temps d'accès. Magento Wiki : pour les serveurs Linux, si la journalisation du temps d'accès est activée sur l'un de vos partitions mysql, serveur Web ou cache, essayez de le désactiver pour augmenter les performances. Si vous utilisez ext3 ou reiserfs, vous pouvez utiliser des méthodes d'écriture de journal plus rapides. Pour plus d'informations, voir Linux.com .
17. Compilez MySQL à partir des sources au lieu du gestionnaire de packages de votre système d'exploitation.
18. Mettez toujours à niveau vers la dernière version de Magento. Non seulement vous obtiendrez plus de fonctionnalités et de correctifs de bogues et de sécurité, mais avec chaque mise à jour, Magento sera plus performant.
19. Taille de la cache de requête: Magento Blog : Modifiez la configuration de votre serveur MySQL pour mieux tirer parti de la RAM de votre serveur. La plupart des distributions Linux fournissent un package MySQL conservateur prêt à l'emploi pour garantir qu'il fonctionnera sur un large éventail de configurations matérielles. Si vous avez suffisamment de RAM (par exemple, 1 Go ou plus), vous pouvez essayer de modifier la configuration. Un exemple my.cnf est ci-dessous, bien que vous souhaitiez consulter la documentation MySQL pour une liste complète des directives de configuration et des paramètres recommandés.
20. définissez «php_value memory_limit 128M» dans votre configuration php ou ajoutez-le à votre fichier .htaccess pour vous assurer de ne pas manquer de mémoire.
21. Utilisez un système de fichiers basé sur la mémoire pour les données dynamiques. Si vous stockez des données dynamiques ( var / cache , var / session ) sur RAMdisk ou tmpfs, les E / S disque sont réduites.
22. Modifiez realpath_cache_size dans php.ini.

    realpath_cache_size = 1 M ( attention , ce sont  par apache processus )    realpath_cache_ttl=86400 (ok for production site) 

23. Memcache (pour le hardcore) est documenté dans http://www.magentocommerce.com/boards/viewthread/9037/ et plus de conseils de http://alexle.net/archives/275 pour vous aider à être opérationnel.
24. Désactivez la directive PHP open_basedir. Lisez ceci .
25. Élimine les analyses de structure de répertoires pour les fichiers .htaccess.
26. Innodb_buffer_pool_size recommandé.
    • Serveur Web et DB combiné, 6 Go de RAM:  2-3 Go
    • Serveur de base de données dédié, 6 Go de RAM: 5 Go
    • Serveur de base de données dédié, 12 Go de RAM: 10 Go
27. Cache de requête: query_cache_size: 64 Mo, query_cache_limit: 2 Mo
28. Utilisez un serveur d'arrière-plan distinct pour gérer les utilisateurs administratifs, traiter les activités d'arrière-plan (cron), générer préalablement la mise en cache pleine page et gérer les requêtes multimédias.
29. Utilisez plusieurs nœuds Web (serveurs frontaux) pour gérer la navigation et le paiement.
30. Utilisez la mise en cache du proxy inverse Varnish, explication Magento par @alistairstead: Vernissez votre boutique Magento, faites-la voler!.
31. Si vous avez un site populaire qui est fortement exploré par les moteurs de recherche, vous pouvez économiser des ressources en peaufinant votre robots.txt.
32. Essayez certaines de ces extensions de cache:
    • http://www.artio.net/magento-extensions/m-turbo-accelerator
    • http://www.aitoc.com/en/magento_booster.html
    • http://www.tinybrick.com/magento-modules/performance.html/
33. Installez l'addon Yireo DisableLog. Cela empêche Magento d'écrire des tonnes de choses dans votre base de données, ce qui est inutile lorsque vous utilisez déjà quelque chose comme Google Analytics.

B) Modèle

1. Optimisez toutes vos images (modèles) - La plupart, sinon toutes, devraient être inférieures à 10 Ko.
   • Recadrez l'espace blanc à l'aide de votre éditeur d'images.
   • Utilisez des fichiers PNG8 ou GIF plutôt que des fichiers Jpeg et n'utilisez pas la transparence (selon le nombre de couleurs que vous utilisez et la taille de l'image, mais essayez par vous-même).
   • Mettre à l'échelle les images: créez des images dans les dimensions dont vous avez besoin et ne les redimensionnez pas dans l'éditeur.
   • Utilisez la compression d'image (vous pouvez utiliser smush.it pour le faire pour vous).
   • Utilisez CSS Sprites, il existe même des générateurs CSS Sprite .
2. Réduisez votre Css, supprimez le code inutilisé .
3. Minimisez l'utilisation de Javascript.
4. Utilisez un modèle léger comme base pour votre modèle. Par exemple: le thème SEO Yoast Blank .
5. Spécifiez les dimensions de l'image .
6. Utilisez le cache de bloc et la sortie HTML dans vos extensions.
7. Appliquer Javascript Lazy Loader pour le prototype .

C) Configuration de Magento

1. Désinstallez toutes les extensions que vous n'utilisez pas réellement.
2. Désactivez les modules que vous n'utilisez pas:  Système -> Configuration -> Avancé -> Avancé. ! [entrez la description de l'image ici] [1]
3. Activez tous les caches Magento: Système -> Gestion du cache.  
4. Utilisez un outil de suivi des statistiques hors site comme Google Analytics et non pas sur site. La plupart de ceux-ci utiliseront Javascript, hébergez le Javascript vous-même.
5. Combinez Javascript et combinez les fichiers CSS : Système -> Configuration -> Avancé -> Développeur -> 'Paramètres Javascript' et 'Paramètres CSS' . Vous pouvez également envisager d'utiliser une extension pour ce faire, comme l' extension Fooman Speedster , selon celle qui vous le mieux.
6. Essayez certaines des extensions de performances de Magento.
7. Activez le catalogue plat Magento, utile uniquement pour les très grands catalogues pour ressentir les améliorations.
8. N'utilisez pas la navigation en couches si vous n'en avez pas vraiment besoin, cela demande beaucoup de ressources.
9. Utilisez la fonction de compilation de Magento. Il est indiqué que vous augmentez les performances de 25% à 50%: Système> Outils> Compilation. Edit: Yoav Kutner (Magento CTO) m'a fait savoir que " dans les versions ultérieures depuis que nous avons optimisé le catalogue EAV, la compilation Magento n'est pas vraiment nécessaire si vous avez une mise en cache de code octet et si elle est configurée correctement ".
10. Utilisez le stockage de session correct, choisissez le système de fichiers ou la base de données (lors de la configuration). La plupart des installations devraient utiliser le "système de fichiers" car il est plus rapide et ne fait pas croître la base de données. Mais si votre site s'exécute sur plusieurs serveurs, vous devez sélectionner "base de données" afin que les données de session d'un utilisateur soient disponibles quel que soit le serveur à partir duquel sa demande est servie. Plus d'informations à ce sujet auprès d'Ashley Schroder sur Magebase.com.
11. Limitez le nombre de produits sur une page de présentation des produits.
12. Définissez uniquement les propriétés frontales d'attribut sur «Oui» que vous allez réellement utiliser. Réglez tous les autres sur «Non». Ne pas utiliser dans la recherche rapide, la comparaison de recherche avancée, etc., etc.: Catalogue -> Attributs -> Gérer les attributs -> Propriétés frontales.  
13. Désactivez le journal Magento : Système -> Configuration -> Avancé -> Développeur -> Paramètres du journal (la valeur par défaut est désactivée).  

Conseil d'entreprise uniquement:

• Désactivez Enterprise_CatalogEvent. Allez dans Admin -> Système -> Configuration -> Catalogue -> Événements de catalogue. Ensuite, vous souhaitez désactiver les paramètres pour "Activer la fonctionnalité des événements de catalogue" et "Activer le widget d'événements de catalogue".
• Activez la recherche Solr, c'est plus rapide que la configuration par défaut, surtout lorsque vous avez beaucoup de produits (> 10k).
• Activez la mise en cache pleine page.

D) Test de vitesse, analyse, surveillance

1. Testez votre site Magento avec Magento Speed ​​Test (par Ashley Schroder)
2. Exécutez votre site via websiteoptimization.com.
3. Utilisez l'extension Google Page Speed ​​Firefox ou Yahoo Yslow pour obtenir des conseils de Google et Yahoo.
4. Mettre en œuvre des mesures de vitesse Google dans Analytics: mesurer le temps de chargement de la page avec le rapport d'analyse de vitesse du site
5. Surveillance de la vitesse et alertes de temps d'arrêt.
   • Mon.itor.us
   • Pingdom

Conseils bonus

(car cela n'accélère pas réellement le frontend mais seulement le backend):

• Utilisez K-Meleon si vous êtes sous Windows pour votre travail d'administration général. Il rend le back-end JS lourd de Magento beaucoup plus rapide que tout autre navigateur.
• Utilisez l' extension GoogleGears de Yireo.com pour mettre en cache les fichiers statiques localement.
• Utilisez une application PC / Mac locale pour gérer Magento (comme  mag-manager.com ).

Je me rends compte que vous ne pouvez probablement pas utiliser tous les conseils ci-dessus, mais il ne s'agit pas de les utiliser tous, et parfois vous faites simplement le choix de donner à une fonctionnalité une priorité sur les performances et c'est OK. Si vous ne pouvez appliquer que certains d'entre eux, vous augmenterez toujours la vitesse et gagnerez en expérience utilisateur. Et rappelez-vous: comme la vitesse dépend de nombreuses variables, certains conseils peuvent ne pas avoir d'impact sur votre site Web tandis que d'autres peuvent avoir un impact énorme. Alors, testez toujours l'impact de chaque étape que vous prenez et agissez en conséquence.

1. Images - J'ai vu de nombreux cas où la personne qui télécharge des images (produits, pages CMS, etc.) n'est pas formée à l'optimisation de la taille des images. Il existe de nombreux articles disponibles en ligne, mais beaucoup d'entre eux ne sont que du bon sens.

   • N'utilisez pas d'images pour du texte.
   • Utilisez correctement JPEG / GIF / PNG (c.-à-d. N'utilisez généralement pas PNG pour les images photographiques)
   • Utilisez des images-objets pour les petites images car vous pouvez regrouper un tas de petites images dans un seul fichier, vous donnant ainsi une seule requête HTTP au lieu de dizaines ou plus. Vous pouvez également envisager des icônes de police.
   • Enregistrez les images avec la qualité la plus basse possible tout en restant bien visible. Je trouve que le point idéal se situe souvent autour de la qualité 50-60 pour JPEG. Parfois, une qualité de 20 est parfaitement acceptable et vous pouvez réduire une image de 300 Ko à 30 Ko. C'est de grosses économies.
   • Envisagez un chargement paresseux sur les pages lourdes d'images.

2. Demandes HTTP - Un autre gros délinquant. Parfois, il n'y a tout simplement pas grand-chose à faire pour réduire les demandes, mais vous devriez toujours essayer de réduire cela au maximum. Magento fournit quelques fonctionnalités pour vous aider à sortir de la boîte (fusion CSS / JS).

3. Recherches DNS supplémentaires - je dirais que c'est le plus important pour le processus de panier / paiement. De nombreux magasins auront diverses intégrations d'API qui appellent des services. Bien que vous ne puissiez pas faire grand-chose pour rendre la réponse API d'un fournisseur d'expédition beaucoup plus rapide, vous pouvez au moins identifier les services lents qui ne seront pas facilement visibles autrement. Pensez au temps supplémentaire qu'une commande pourrait prendre si vous passez des appels à UPS, FedEx, USPS, les fournisseurs de taux de taxe, les fournisseurs de paiement, les sites affiliés, etc.

4. Autres facteurs - Certains des autres facteurs mentionnés dans votre rapport n'auront probablement pas un impact aussi important que les requêtes Images et HTTP. Cela peut certainement valoir la peine de minimiser CSS et Javascript, mais les gains réels ne sont vraiment perceptibles que sur le long terme. De plus, un CDN peut vraiment aider, surtout si vous proposez des produits téléchargeables.

Je pense qu'il y a souvent trop d'importance accordée à l'hébergement seul. Dans le passé, j'ai été chargé d'effectuer certains ajustements de serveur pour que les sites améliorent la vitesse, seulement pour découvrir que la page d'accueil chargeait 20 Mo d'actifs.

De même, le livre blanc de Magento sur les performances du serveur ne sera d'aucune utilité si votre site est bâti avec trop de ballonnement. Si votre objectif est d'améliorer la vitesse de votre site, la première étape devrait être de regarder les pages elles-mêmes pour trouver des inefficacités. Ce n'est qu'après avoir déterminé que votre site est aussi léger et méchant que vous le souhaitez que vous commenciez à envisager de mettre à niveau votre hébergement.

Pour mémoire, un site que je gère utilise un SIP-200 sur Nexcess depuis environ cinq ans et reçoit en moyenne 5000 visites par jour (c'est saisonnier, donc il culmine à plus de 10 000 à la fin du printemps / début de l'automne). Je n'ai absolument rien à redire sur cette qualité de serveur pour ce site, et nous utilisons une version assez courante de Magento CE avec des milliers de produits dans des dizaines de catégories.

Les images sont un énorme problème sur Internet, presque aussi gros que le javascript. La première chose que vous devez faire est d'optimiser vos images.

• Configurer un réseau de diffusion de contenu
• Optimisez vos images
• Utiliser une image LazyLoader

Maintenant sur vos fichiers Javascript :

• Compressez-les et combinez-les
• Éliminez les rechargements de page supplémentaires en utilisant plus d'ajax
• Déposez vos fichiers JS dans le pied de page
• Chargez vos fichiers JS à partir d'un domaine différent

Cache comme un fou

• Activez la mise en cache MySql et augmentez la taille du pool de mémoire
• Activez la mise en cache APC pour que PHP n'ait pas à se réapprendre à chaque fois
• Activer la mise en cache pleine page Magento et utiliser la mise en cache Apache
• Activez GZIP pour livrer vos fichiers à l'utilisateur plus rapidement.
• Activez les en-têtes Expires appropriés pour que vos utilisateurs mettent également en cache

Magento dispose également d'un certain nombre de mécanismes de mise en cache internes:

• Activez la mise en cache évidente de Magento
• Activer la compression CSS et JS et la compilation depuis l'administrateur
• Activer le catalogue Flat et les produits pour accélérer les appels mysql
• Activer le compilateur Magento pour accélérer l'autochargeur PHP

Si vous voulez plus de détails, j'ai tiré les informations de cette base de connaissances .

Voici ce que je suggérerais pour accélérer le site Magento:

1. Effectuer l'audit des extensions tierces et l'audit TTFB. Certains plugins personnalisés ralentissent Magento. Obtenez une liste de tous les modules tiers et désactivez-les un par un. Vitesse de référence avec www.webpagetest.org. Lorsque vous identifiez un agresseur, contactez son fournisseur pour le lui faire savoir. Pour exécuter l'audit TTFB, installez un programme gratuit xhprof ou utilisez NewRelic .

2. Découvrez si vos ressources d'hébergement sont suffisantes pour exécuter Magento. Installez une nouvelle copie de Magento la même version sur votre hébergement. Comparez sa vitesse au site en direct. S'il est nettement plus rapide que votre site, votre hébergement est OK. S'il est aussi lent que votre site en direct, votre hébergement n'est pas bon.

3. Effectuez diverses optimisations frontales. Ceux-ci incluent: optimisation d'image, compression gzip, minification CSS / JS. Vous pouvez obtenir un rapport sur ce que vous devez faire en exécutant votre site sur Google PageSpeed ​​Insights .

Tiré de mon article .

• Vous devez vous concentrer à la fois sur l'optimisation de votre site Web (structure, CSS, images, etc.) et sur la recherche d'un hébergeur vraiment rapide.

• Je vous suggère de rechercher un hôte qui offre un stockage SSD et Cloudflare CDN et quels services d'hébergement sont spécialement optimisés pour un site Web basé sur Magento.

• J'utilise actuellement le plan dit `` populaire '' pour mon site Web et il fait un excellent travail.

• Voici ses spécifications complètes: https://www.bgocloud.com/hosting/websites-cpanel/popular-plan .

Si vous pensez que ces fonctionnalités ne vous conviennent pas, vous pouvez consulter les autres plans ou la page des serveurs dédiés.

J'ai trouvé la chose la plus importante en ce qui concerne la vitesse du site et magento est votre serveur. Êtes-vous sur un hôte dédié? Vous devez être. Surtout un avec des disques SSD. La partie la plus lente de Magento est la façon dont il traite réellement PHP et affiche la page, et le seul moyen de lutter contre cela est un meilleur serveur. Également un cache pleine page, essayez Lesti FPC.

Il y a la réponse longue et la réponse courte, comme Guido l'a déjà souligné, voici les étapes que vous devez suivre pour votre configuration. Vous devrez trouver une ressource compétente pour parcourir toutes les combinaisons pour trouver le meilleur ajustement, cela prend beaucoup de temps mais le processus standard des sites Magento doit être exécuté. Il y a aussi une réponse courte mais nous travaillons avec un incubateur et ils utilisent des techniques d'entreprise principalement pour les plates-formes haut de gamme, mais l'ont porté sur Magento mais ce ne sera pas pertinent ici. Vous devrez trouver l'équilibre exact entre le matériel, le fpc, la mise en cache, les exigences commerciales, le seul problème étant une fois que vous avez terminé l'exercice si vous modifiez considérablement tout ce dont vous aurez besoin pour le réexécuter.

Ou vous ignorez tout cela, utilisez la même pile technologique qu'Etsy, le même hébergement que Very avec plusieurs nœuds, sautez le fpc, près de fpc ttfb, 1-2s charges dynamiques et utilisez Pagespeed tous additionnés, ce qui vous donne un As dans tous les domaines. . Maintenant, si vous avez plus de codeurs et d'extensions zélés, il y a des limites. Cela dépend si vous voulez emprunter la voie technologique et que vous devez passer par tout cela au nième degré où les programmeurs seront en désaccord avec l'entreprise, ou si vous adoptez la vision de l'entreprise et trouvez la meilleure solution indépendamment des protestations technologiques, ce qui entraîne souvent moins de difficultés techniques. travail.