Optimisations techniques, temps de chargement - GOLIAT.FR

Nouveau WRInaute
Tout d'abord, Bonjour à tous !

Il y a quelques temps j'avais déjà sollicité l'aide de la communauté webrankinfo pour des améliorations en SEO. Grace aux conseils et avis de chacun nous sommes passés de 4 mots clés dans le top 3 à 250 mots clés !

Je reviens aujourd'hui avec des "problèmes" plus technique.
Nous avons détecté une lenteur de chargement, des images trop lourdes etc.
Après un rapport avec le nouvel outil de google "lighthouse" Voici ce qui ressort

Performance 0 / Accessibility : 63 / Progressive web app : 45 / Best practice : 63 / SEO : 90
Premier affichage 41 740 ms / latence d'entrée 5000 ms

Des images entre 20 et 150 ko ( il suffit de compresser ? sauf que ! Nous compressons les images, à la sortie une image qui fait 20ko se retrouve a en faire 140. Je m'explique. Nous utilisons le thème WP JUPITER, celui ci range les images dans un dossier "bfi_thumbs" et créer des images beaucoup plus lourdes que le poids réel au départ ... Aller savoir pourquoi !)

googlefontapis > chargement > 700 ms
javascript > chargement > 21 000 ms

Sans compter que nous avons deux formulaires de contact sur notre première page. Ceux ci sont générés dans mailchimp et intégrés dans le site via un plug in qui fait le lien entre notre site et MC.

Nous sommes donc à la recherche, d'avis, piste, solution pour optimiser le temps de chargement de notre site internet.
Tout avis global ou remarque constructive sera la bienvenue.

Config : wordpress, theme jupiter, serveur mutualisé chez OVH.
domaine: goliat.fr

Merci d'avance pour vos réponses !
L'équipe GOLIAT
 
Membre Honoré
Bonjour,
Il y a quelques temps j'avais déjà sollicité l'aide de la communauté webrankinfo pour des améliorations en SEO. Grace aux conseils et avis de chacun nous sommes passés de 4 mots clés dans le top 3 à 250 mots clés !
C'est cool :) (cf. premier sujet : ici).
Nous avons détecté une lenteur de chargement, des images trop lourdes etc.
C'est normal avec le site Internet actuel, il faut continuer les optimisations.
Et vous pouvez aussi revoir certaines bases aussi pour continuer d'améliorer le site Internet actuel.

Nous sommes donc à la recherche, d'avis, piste, solution pour optimiser le temps de chargement de notre site internet.
Voici des pistes : Il faudrait améliorer les images (vous en avez pour un long moment sachant qu'il faudra vérifier chacune des images actuelles du site Internet pour correction si vous souhaitez bien faire pour optimiser le temps de chargement des pages du site Internet que vous avez), mieux compresser par exemple celles-ci sans perte de qualité (en effet avec la compression il faut faire plusieurs tests pour savoir quelle est la bonne compression pour chaque image, c'est certaines fois au cas par cas), vérifier la bonne utilisation des images et vérifier à nouveau les bases pour celles-ci (pour optimiser le temps de chargement, mais aussi pour améliorer le référencement naturel), autre chose sera aussi d'améliorer le thème Jupiter utilisé avec votre version actuelle de WordPress qui n'est pas optimisée de manière optimale (comme beaucoup d'autres thèmes pour WordPress par défaut, il faut modifier le code source pour que ce soit mieux pour le référencement naturel), penser à mettre à jour aussi le WordPress utilisé vous êtes à la version 4.8.5 (qui a plusieurs versions en retard, nous sommes déjà à la version 4.9.4 depuis début février 2018 et de nouvelles versions sont prévues, cf. le site Internet du CMS WordPress), améliorer le code source du site Internet pour qu'il soit aussi plus rapide (ceci concernant directement l'optimisation du temps de chargement du site Internet et des différentes pages de celui-ci) et bien d'autres changements.

Vous n'êtes qu'au début de l'optimisation du site, courage et motivation.

N'hésitez pas entre deux messages à présenter vos avis sur les sujets du forum : disponibles ici
pour aider aussi les autres personnes de la communauté : fonctionnement de l'entraide.

Temps de réponse : 25 minutes.
Cordialement.
 
Nouveau WRInaute
Merci pour ces idées et pistes

En ce qui concerne les images, nous avons déjà essayé de travailler dans ce sens.
exemple concret, les images du slide en première page. Sur mon ordinateur l'image est affichée avec un poids d’environ 25ko.
Quand j'upload sur le site, lighthouse m'indique qu'elle fait 3x plus .. comme si le theme retravaillait l'image
ça peut paraître étrange, mais quelqu'un à t'il déjà eu un cas similaire ?

Une piste pour rendre le temps de chargement des formulaires plus rapide ?

Dans quel sens retravailler le code source du thème ? Je ne suis pas développeur, existe t'il des solutions "simples" ? des outils ?
 
Membre Honoré
Bonjour,
[...] images du slide en première page [...] poids d’environ 25ko.
150 ko pour la première image du slide.
ça peut paraître étrange
Désactiver la compression automatique.
Dans quel sens retravailler le code source du thème ?
Optimisations à faire.
Je ne suis pas développeur, existe t'il des solutions "simples" ? des outils ?
L'éditeur via WordPress, le bloc note, etc. après c'est suivant les optimisations qui sont réalisées.

Temps de réponse : 7 minutes.
Cordialement.
 
WRInaute impliqué
Nous avons détecté une lenteur de chargement

Vous avez l'oeil !

serveur mutualisé chez OVH

Et voilà, ne cherchez pas plus loin. Vous payez un prix dérisoire, vous avez des performances dérisoires, c'est normal.

Alors bien sûr, il serait possible d'accélérer grandement votre site en le retravaillant. Mais ça serait mal utiliser son temps parce que le gros, gros, gros problème de votre site, c'est son hébergement.
 
WRInaute impliqué
Attention, ça n'est pas "la solution miracle".
Mais actuellement, vous vous prenez systématiquement une pénalité de plusieurs secondes avant même que le navigateur commence à recevoir la moindre donnée, c'est très handicapant.

Ensuite, vous devriez supprimer carrément le script de Mailchimp, minifier votre CSS principale (énorme), et ajouter des link rel=preconnect sur les domaines de Google Fonts. Et passer vos images dans un outil comme ImageOptim (sans perte) avant de trouver une meilleure solution.
Et à votre place, j'éliminerais l'indicateur de chargement qui attend que toute la page soit chargée.


Et après, si vous voulez vraiment faire les choses à fond, vous pourriez vous demander pourquoi votre code est aussi énorme (HTML et CSS).
C'est un empilement de frameworks CSS avec des milliards de sélecteurs dans tous les sens, ça fait un peu mal au coeur de voir ça quand on aime le code propre. Ou les bonnes performances : toujours dans Lighthouse, le retard tactile est estimé à 162 ms, ça fait beaucoup.

Mais après tout, votre site n'est pas un outil sur lequel les gens vont aller tous les jour y passer une heure, donc ça n'est pas la peine de l'optimiser comme si vous étiez Google.
 
Nouveau WRInaute
Merci pour toutes ces réponses.

Pourriez vous apporter quelques précisions sur certains points ?
- "systématiquement une pénalité de plusieurs secondes avant que le navigateur commence a recevoir la moindre donnée"
Pourquoi cela ? Quel type de serveur serait mieux adapté ?

- Le script mailchimp est il vraiment handicapant ? Car c'est notre source de génération de leads. Ou autre solution envisageable ?

- Le retard tactile ? Pourriez vous expliquer ce que cela signifie ?

- Le code HTML et CSS aussi lourd ? Surement problème du theme JUPITER


Certes nous ne sommes pas google, mais un site plus performant, attirera plus de visite, donc plus de contact et a priori plus de CA.

Merci pour votre expertise !
 
WRInaute impliqué
- "systématiquement une pénalité de plusieurs secondes avant que le navigateur commence a recevoir la moindre donnée"
Pourquoi cela ? Quel type de serveur serait mieux adapté ?

Pourquoi : parce que la puissance qu'il y a derrière votre offre est sous-dimensionnée et partagée par un trop grand nombre de personnes. Ce qui fait que c'est lent, et que l'attente est variable selon l'occupation générale de la machine, par des sites qui n'ont rien à voir avec le vôtre.
Qu'est-ce qui serait mieux... euh... une offre supérieure. Je ne sais pas ce que vous avez actuellement mais ça semble être vraiment de l'entrée de gamme prix plancher. Essayez de monter un minimum. Je ne connais pas les offres en mutualisé, je ne travaille qu'avec des serveurs dédiés.

"Le script mailchimp est il vraiment handicapant ?"
Il est chargé de manière synchrone et il est lent à charger, donc oui, quand même. A priori vous pouvez vous en passer et utiliser tout de même leurs services : le script ne sert, semble-t-il, qu'à la vérification des données du formulaire et fait doublon avec les mécanismes de vérification des navigateurs. Et en plus, les messages d'erreur s'affiche en gris foncé sur bleu foncé, ça n'est pas très lisible.

- Le code HTML et CSS aussi lourd ? Surement problème du theme JUPITER
Effectivement...

- Le retard tactile ? Pourriez vous expliquer ce que cela signifie ?
C'est une estimation du temps qu'il va falloir au navigateur pour réagir aux sollicitations de l'utilisateur (défilement...). Il se cumule au retard du téléphone ( 90ms, bien souvent pour les téléphones Android bas de gamme ou faux haut de gamme). En tout, on arrive autour de 250 ms, et à ce niveau, l'impression de lourdeur est bien présente.
 
Nouveau WRInaute
Pour le formulaire mailchimp nous utilisons le plugin MC4WP
c'est peut être celui ci qui fait que le formulaire soit long a chargé ? Que proposez vous pour charger plus rapidement le formulaire ?

Pour régler le retard tactile, je suppose qu'il faut mettre les mains dans le code ?
 
Membre Honoré
Bonjour,
Le changement hébergement serait donc la solution "miracle" ?
Non, c'est plus complexe et comme le disait Pirelli : "sans maîtrise, la puissance n'est rien".
C'est un simple site vitrine et blog WordPress, même avec un hébergement low cost il devrait être rapide.
un site plus performant, attirera plus de visite, donc plus de contact et a priori plus de CA.
En effet, s'il est bien optimisé ce sera mieux.

N'hésitez pas entre deux messages à présenter vos avis sur les sujets : ici.

Temps de réponse : 7 minutes.
Cordialement.
 
Nouveau WRInaute
Pour résumer
- Compresser les images
- MAJ de la version de WP
- Désactiver la compression automatique
- Optimiser le thème jupiter ( comment peut on voir de quel coté le thème n'est il pas optimisé ? points à améliorer ?)
- link=preconnect sur les google font
- Éliminer l'indicateur de chargement
- Éliminer le script mailchimp ( peut on utiliser le formulaire et le service mailchimp sans le script des messages d'erreur etc ?)
 
Membre Honoré
Bonjour,
Optimiser le thème jupiter ( comment peut on voir de quel coté le thème n'est il pas optimisé ? points à améliorer ?)
En vérifiant le code au W3C, en vérifiant le code source actuel, les bases web et par expérience.
Et pour l'outil, vous pouvez faire un développement spécifique.

N'hésitez pas entre deux messages à présenter vos avis sur les sujets du forum : disponibles ici
pour aider aussi les autres personnes de la communauté : fonctionnement de l'entraide.

Temps de réponse : 5 minutes.
Cordialement.
 
Nouveau WRInaute
Au chapitre des bonnes nouvelles
- Nous avons compressés les images (pour la home page)
- Enlever les googles fonts
- Éliminer l'indicateur de chargement
- héberger le script mailchimp sur notre serveur, avec la compression Gzip celui ci charge beaucoup plus rapidement.

Google speed insight indique " réduire le temps de réponse au serveur", pensez vous qu'il s'agisse d'un problème de performance chez ovh avec notre mutualisé ?
 
Membre Honoré
Bonjour,
Nous avons compressés les images (pour la home page)
Il faudra améliorer la qualité, c'est trop flou.
Google speed insight indique " réduire le temps de réponse au serveur", pensez vous qu'il s'agisse d'un problème de performance chez ovh avec notre mutualisé ?
Un problème du site Internet (c'est un simple site vitrine, il devrait s'afficher rapidement).
Avec un hébergement plus puissant, le site ira plus vite, mais le problème ne sera que déplacé.
C'est comme acheter un ordinateur à 2000 euros, uniquement pour utiliser le bloc-notes.

Il faudra aussi corriger les autres erreurs du site Internet. :)

Temps de réponse : 15 minutes.
Cordialement.
 
WRInaute discret
Bonsoir,

Je ne sais ce que vous utilisez pour minifier votre css ni comment fonctionne wordpress mais votre fichier css est plein de commentaires et fait plus de 1Mo ! Vous pouvez diviser sa taille par deux en minifiant correctement. avec https://cssminifier.com/ ou un plugin peut-être...

Bonne soirée.
 
WRInaute impliqué
je prends le sujet au milieu, donc je réponds sur le premier psot (pas le temps de lire tout le sujet)

En gros faire F12 par exemple dans firefox
Aller dans l'onglet reseau, raffraichier la page et la on voir toujours parfaitemetn ce qui est lent, pas lent, l'asynchone, le poids ....
Si ca ne suffit pas, on prend fiddler et on analyse
Donc la en ce moment
je vois
1591 ms rien que pour le html de base (c'est un temps minable) --> forcément le browser va déjà attendre 1.5s avant de pouvoir analyser le contenu et lancer la suite : c'est bloquant
--> if faut déjà résoudre ca !!!!! --> souvent il faut une base de données dédiée et pluq rapide pour les CMS
(je vous donen des temps nomaux pour des sites rapides : 350 ms au plus pour le html)

ensuite les requêtes partent en parallele : ok

Je vais me faire des amis mais on s'en fout complètement si une image est trop grosse du moment qu'elle arrive en temps voulu de manière asynchone et qu'elle ne plombe pas le temps page achevée

Donc la les images arrivent toutes en parallèle entre +72 et +123 ms (sur ma connexion !!!
ce serait différent en Arabie Saoudite mais je ne vais pas parler du web mondial)
On peut toujours optimiser (on optimise tout)., mais le vrai problème au niveaux des images qui pourrait planter la vitesse du site chez certains hébergeurs quand ils sont fatigués c'est le trop gros nombre de requêtes d'images. Il y en a vraiment trop (penser au sprites lors de l'optimisation gold) Bref dans la version actuelle c'est pas plombant chez moi.

2456d.css est plombant : 445ms : beurk !!!!!! Il faut absolument découper le css !!!!

Avant de voulair améliorer les images, il faut améliorer ceci :

html + css = 1591 + 445 ms = 2 secondes d'attentes avant même de commencer à télécharger les images qui elle ne mettent que 123ms au plus pour toutes venir !!!

Aussi ce truc : jquery.flexsider.js
A lui tout seul il plombe completement l'arrivée du timeout de la page
Il est trop lent a répondre. Si c'est jsut un script "static", il faut impérativement l'herber sur golitath.fr


voila une analyse gratuite ;)
 
Membre Honoré
Bonjour,
fichier css est plein de commentaires et fait plus de 1Mo !
Et vous ne parlez que d'un fichier, il y en a plusieurs qui sont à améliorer.
2456d.css est plombant : 445ms : beurk !!!!!! Il faut absolument découper le css
Et vérifier aussi les changements d'URL, ce CSS n'est déjà plus disponible.

Il y a aussi un mélange de CSS affichés directement en source de la page et non en fichiers.
C'est pareil pour le mélange avec les codes JavaScript qui sont disponibles avec les pages.
Vous devez encore optimiser le code et corriger les erreurs aussi à ce niveau.
Et il faudra aussi optimiser le site pour le référencement naturel et les clients.
Les éléments du sujet ne sont que le haut de l'iceberg, courage.

N'hésitez pas à vous présenter au forum : ici et entre deux messages présenter vos avis aussi sur les sujets : ici, pour aider les autres personnes de la communauté d'entraide.

Temps de réponse : 10 minutes.
Cordialement.
 
Discussions similaires
Haut