Quels sont les premiers points à contrôler pour optimiser son site web ? Quels bénéfices pour l'affichage et à quel coût ? Cas pratique avec Prestashop et Drupal au Barcamp e-commerce et SEO d'Avignon le jeudi 4 avril 2013

1. Performance d’un site web
Barcamp e-commerce & SEO – Jeudi 4 avril 2013
commercial@vaisonet.com - www.vaisonet.com

2. Pourquoi faire attention à la vitesse
de son site ?
Impact sur le CA
Impact sur la navigation
Impact suspecté sur le référencement
Barcamp e-commerce & SEO – Jeudi 4 avril 2013
commercial@vaisonet.com - www.vaisonet.com

3. Pourquoi faire attention à la vitesse
de son site ?
Exemples :
100 ms de temps de chargement supplémentaire, et
Amazon va perdre 1% de ses ventes
500 ms de plus sur Google, c'est 20% de recherche en
moins.
2 secondes de plus chez Bing, et c'est plus de 4% de
revenu en moins par utilisateur.
Barcamp e-commerce & SEO – Jeudi 4 avril 2013
commercial@vaisonet.com - www.vaisonet.com

4. Comment mesure la vitesse ?
Mesure ponctuelle : onglet réseau de Firebug
Barcamp e-commerce & SEO – Jeudi 4 avril 2013
commercial@vaisonet.com - www.vaisonet.com

5. Comment mesure la vitesse ?
Mesure régulière :
Essentielle pour voir les pics de charges, des anomalies
passagère.
Google Analytics  vitesse perçue par l’utilisateur
Google Webmaster Tools  vitesse perçue par Google
Cacti, MRTG, Nagios, Mumin, …  vitesse
« reproductible »
Barcamp e-commerce & SEO – Jeudi 4 avril 2013
commercial@vaisonet.com - www.vaisonet.com

6. Prix de l’optimisation
Barcamp e-commerce & SEO – Jeudi 4 avril 2013
commercial@vaisonet.com - www.vaisonet.com

7. Axes de progrès
Temps de chargement des pages
Optimisation des images
Compression CSS / Javascript / HTML
Proximité du serveur
Serveur « média » : CDN, Varnish
Serveur « application » : Apache, Nginx
Barcamp e-commerce & SEO – Jeudi 4 avril 2013
commercial@vaisonet.com - www.vaisonet.com

8. Axes de progrès
Comment automatiser ? Cas pratique avec les images
Une image envoyée par un utilisateur n’est jamais
optimisée
C’est au développeur de proposer une solution
Barcamp e-commerce & SEO – Jeudi 4 avril 2013
commercial@vaisonet.com - www.vaisonet.com

9. Axes de progrès
Comment automatiser ? Cas pratique avec les images
Prestashop
Barcamp e-commerce & SEO – Jeudi 4 avril 2013
commercial@vaisonet.com - www.vaisonet.com

10. Axes de progrès
Comment automatiser ? Cas pratique avec les images
Prestashop

11. Axes de progrès
Comment automatiser ? Cas pratique avec les images
Drupal
Barcamp e-commerce & SEO – Jeudi 4 avril 2013
commercial@vaisonet.com - www.vaisonet.com

12. Axes de progrès
Comment automatiser ? Cas pratique avec les images
Drupal
84110 Vaison la Romaine - 04 90 36 09 45
commercial@vaisonet.com - www.vaisonet.com

13. Axes de progrès
Comment automatiser ? Cas pratique avec les images
Utilisation avancée avec les CDN :
1. Charger les images dans le CDN avec un traitement par
batch : File Conveyor
2. Diffuser les images via un CDN
Barcamp e-commerce & SEO – Jeudi 4 avril 2013
commercial@vaisonet.com - www.vaisonet.com

14. Axes de progrès
Et pour aller plus loin ?
Extension Firefox « Google PageSpeed »
https://developers.google.com/speed/pagespeed/?hl=fr
Barcamp e-commerce & SEO – Jeudi 4 avril 2013
commercial@vaisonet.com - www.vaisonet.com

15. Axes de progrès
Et pour aller plus loin ?
Extension Firefox « Google PageSpeed »
https://developers.google.com/speed/pagespeed/?hl=fr

16. Hébergement
Mutualisé / Serveur virtuel / Serveur dédié
Performance / Disponibilité
Barcamp e-commerce & SEO – Jeudi 4 avril 2013
commercial@vaisonet.com - www.vaisonet.com

17. Génération des pages
Installation de PHP :
Module Apache / CGI
Performance vs Sécurité ?
Barcamp e-commerce & SEO – Jeudi 4 avril 2013
commercial@vaisonet.com - www.vaisonet.com

18. Génération des pages
Développement
Performance vs Maintenance ?
Bonnes pratiques
Design pattern
Barcamp e-commerce & SEO – Jeudi 4 avril 2013
commercial@vaisonet.com - www.vaisonet.com

19. Génération des pages
Cache d’opcode
APC : précompilation et mise en RAM
L’optimisation la plus facile à faire
Le gain le plus efficace (environ de 20 à 40%)
Barcamp e-commerce & SEO – Jeudi 4 avril 2013
commercial@vaisonet.com - www.vaisonet.com

20. Génération des pages
Base de données
Extensions php : PDO / mysql / mysqli
Lecture vs Ecriture
Moteurs de stockage : InnoDB, MyIsam, Memory
SQLite
MySQL, MariaDB, Percona
Barcamp e-commerce & SEO – Jeudi 4 avril 2013
commercial@vaisonet.com - www.vaisonet.com

21. Génération des pages
Base de données MySQL
Attention aux sauvegardes (LOCK, Sauvegarde Slave)
Réplication / Cluster
GeneralQuery, Slow Query, Bin, Error,
Moteurs de stockage : InnoDB, MyIsam, Memory
SQLite
MySQL, MariaDB, Percona
MySQLTuner
Barcamp e-commerce & SEO – Jeudi 4 avril 2013
commercial@vaisonet.com - www.vaisonet.com

22. Cache
Le cache est une mauvaise chose, mais il est
nécessaire
Gérer du cache fait baisser les performances
Utiliser du cache donne des données obsolètes à
l’utilisateur
Barcamp e-commerce & SEO – Jeudi 4 avril 2013
commercial@vaisonet.com - www.vaisonet.com

23. Cache
Quoi mettre en cache :
Cache du navigateur : images, css, html, js
Cache applicatif web : « portions » de site
Cache http
Cache MySQL : requêtes
Barcamp e-commerce & SEO – Jeudi 4 avril 2013
commercial@vaisonet.com - www.vaisonet.com

24. Cache
Où mettre en cache :
Lents : fichier, base de données
Rapides : mémoire vive
Barcamp e-commerce & SEO – Jeudi 4 avril 2013
commercial@vaisonet.com - www.vaisonet.com

25. Gérer les pics d’activité
Distribuer le cache en mémoire vive
Memcache
Répartir les lectures MySQL
Utiliser un CDN
Barcamp e-commerce & SEO – Jeudi 4 avril 2013
commercial@vaisonet.com - www.vaisonet.com

26. Gérer les pics d’activité
Des questions ?
84110 Vaison la Romaine - 04 90 36 09 45
commercial@vaisonet.com - www.vaisonet.com