Performance web. Mesurer. Analyser. Optimiser. Benjamin Lampérier - Benoît Goyheneche. RMLL Beauvais. 8 Juillet 2015

Transcription

1 Benjamin Lampérier - Benoît Goyheneche RMLL Beauvais 8 Juillet 2015

2 1 2 3

3 État des lieux On ne change rien On optimise intelligemment

4 Avant de commencer Mettre les chaines de caractères entre simple quotes est plus rapide qu entre des doubles quotes echo est plus rapide que print

5 Avant de commencer Mettre les chaines de caractères entre simple quotes est plus rapide qu entre des doubles quotes echo est plus rapide que print Plus rapide de 0,006 secondes

6 Quelques repères Le cerveau humain réagit en 500ms

7 Quelques repères Le cerveau humain réagit en 500ms Latence Bande passante

8 Quelques repères Le cerveau humain réagit en 500ms Latence Bande passante Latence applicative

9 Les initiatives à connaitre Make the faster

10 Les initiatives à connaitre Make the faster label mobile friendly

11 Les initiatives à connaitre Make the faster label mobile friendly warning slow

12 Pourquoi optimiser? Référencement

13 Pourquoi optimiser? Référencement Expérience utilisateur

14 Pourquoi optimiser? Référencement Expérience utilisateur Taux de conversion

15 Pourquoi optimiser? Référencement Expérience utilisateur Taux de conversion Coût de l infrastructure

16 Quoi? Vitesse de chargement

17 Quoi? Vitesse de chargement Nombre de requêtes

18 Quoi? Vitesse de chargement Nombre de requêtes Poids de la page

19 Quels outils?

20 Quels outils?

21 Quels outils?

22 Quels outils? Inspecteur de code

23 Comprendre le déroulement d une requête

24 GT Metrix

25 Google speed page

26 Inspecteur de code

27 Un peu de logique Calculons le ratio temps serveur / temps navigateur 0,23 / 3, 65 = 6,3 % pour le serveur 93,7 % du temps pour le navigateur

28 Update Travailler avec des outils à jour PHP : Environ 20% de gain par version.

29 KISS Faire simple

30 Mysql Limiter les requêtes SELECT * VS SELECT MaCol1, MaCol2

31 MySQL : Trouver les requêtes lentes Modifier le fichier my.cnf slow-query-log long query time = 1

32 MySQL : Trouver les requêtes lentes Modifier le fichier my.cnf slow-query-log long query time = 1 log-queries-not-using-indexes

33 MySQL : Trouver les requêtes lentes Modifier le fichier my.cnf slow-query-log long query time = 1 log-queries-not-using-indexes log-output = TABLE

34 MySQL : Utiliser les index L indexation de notre base de données : permet de gagner du temps lors de la recherche ralentit l insertion, la mise à jour

35 Apache : la compression Activer la compression Gzip

36 Apache : la compression Activer la compression Gzip a2enmod deflate && /etc/init.d/apache2 reload

37 Apache : la compression Activer la compression Gzip a2enmod deflate && /etc/init.d/apache2 reload /etc/apache2/conf.d/mod deflate.conf AddOutputFilterByType DEFLATE text/html text/plain text/xml

38 Apache : l expiration ExpiresByType

39 Apache : l expiration ExpiresByType a2enmod expires && /etc/init.d/apache2 reload

40 Apache : l expiration ExpiresByType a2enmod expires && /etc/init.d/apache2 reload /etc/apache2/conf.d/expires ExpiresActive On ExpiresByType image/jpg "access plus 30 days" ExpiresByType text/css "access plus 30 days"

41 PHP : Maîtrisez vos boucles N utilisez pas de fonction dans des boucles for ($x=0; $x < count($array); $x++)

42 PHP : Maîtrisez vos boucles N utilisez pas de fonction dans des boucles for ($x=0; $x < count($array); $x++) Évitez les boucles imbriquées

43 PHP : Maîtrisez vos boucles N utilisez pas de fonction dans des boucles for ($x=0; $x < count($array); $x++) Évitez les boucles imbriquées $result = mysql query("select * FROM copains"); while ($user = db fetch object($result)){ $countresult = mysql query("select count(1) FROM bieres WHERE copain id = $copain.id"); }

44 PHP : Maîtrisez vos boucles N utilisez pas de fonction dans des boucles for ($x=0; $x < count($array); $x++) Évitez les boucles imbriquées $result = mysql query("select * FROM copains"); while ($user = db fetch object($result)){ $countresult = mysql query("select count(1) FROM bieres WHERE copain id = $copain.id"); } $result = mysql query(" SELECT copains.*, count(bieres.id) FROM copains INNER JOIN bieres ON copains.id=bieres.copains id GROUP BY copains.id"); while ($user = db fetch object($result))

45 PHP : Autoload composer.phar dump-autoload --optimize

46 Côté client : le chargement HTML ET CSS dès que possible

47 Côté client : le chargement HTML ET CSS dès que possible Javascript le plus tard possible

48 Côté client : le chargement HTML ET CSS dès que possible Javascript le plus tard possible Différer le chargement des ressources non nécessaires au chargement

49 Côté client : les fichiers Minifier les fichiers

50 Côté client : les fichiers Minifier les fichiers.maclass { /* Commentaire sur ma classe*/ margin: 0px 0px 0px 0px; } devient.maclass{margin:0}

51 Côté client : les fichiers Minifier les fichiers.maclass { /* Commentaire sur ma classe*/ margin: 0px 0px 0px 0px; } devient.maclass{margin:0} grunt, gulp...

52 Côté client : les images Réduire le poids des images

53 Côté client : les images Réduire le poids des images utilisation des sprites css

54 Côté client : Réduire le nombre d appels concaténer les fichiers js et css

55 Côté client : Réduire le nombre d appels concaténer les fichiers js et css css court dans le html

56 Exemples concaténer les fichiers js et css

57 Exemples concaténer les fichiers js et css css court dans le html

58 Exemples

59 Des questions?

60 Merci de votre attention