Optimisation site sous Edge [Réglé]
MickaelFR Membre non connecté
Booster Fusée
- Booster Fusée
- Voir le profil du membre MickaelFR
- Inscrit le : 20/01/2014
- Site internet
- Groupes :
Comparé aux autres navigateurs, lors je test le site sous edge, on dirait que l'optimisation CSS n'est pas pris en compte .. Je suppose que si bien entendu, mais à chaque changement de page, j'ai une certaine latence, et l'image (bannière du site) arrive toujours en retard, ce qui fait un flash blanc durant 1/4 d'une seconde ..
Ceci est présent aléatoirement (60 à 70% tout de même).
Pas bien grave, mais je cherche tout de même à optimiser ceci.
Merci par avance
Édité par MickaelFR Le 02/07/2017 à 08h59
olivierb Membre non connecté
- Modérateur
- Voir le profil du membre olivierb
- Inscrit le : 07/02/2014
- Site internet
- Groupes :
- Equipe Assistance
J'ai le même comportement sous tous les navigateurs dû à la lenteur de mon accès internet (environ 2 à 3 secondes de latence)
L'image de la bannière ne serait pas trop lourde ?
Edit : Les résultats GTMETRIX ne semblent pas très bons : https://gtmetrix.com/reports/planet-truck.fr/Y9eBPtcz
Plusieurs images dont la taille est gérée dans le CSS, le mieux serait que la taille initiale de l'image soit déjà la bonne
Beaucoup d'images méritent d'être réduites.
Tu vois le bon bout, courage
Olivier.
Édité par olivierb Le 02/07/2017 à 11h44
Olivier
janus57 Membre non connecté
- Booster Fusée
- Voir le profil du membre janus57
- Inscrit le : 07/12/2007
- Groupes :
- Equipe Assistance
il faut regarder avec l'outil de dev de edge (section reseau/network) ce qu'il se passe au niveau du chargements des images.
Note : dans ce genre de cas l'optimisation CSS n'a rien à voir, c'est plus la taille des images ainsi que le nombre de requêtes qui influencent.
Cordialement, janus57
MickaelFR Membre non connecté
Booster Fusée
- Booster Fusée
- Voir le profil du membre MickaelFR
- Inscrit le : 20/01/2014
- Site internet
- Groupes :
Mes images sont réduites au max sans perdre de la qualité .. Quelques KO seulement. Je peux pas faire mieux sans toucher la qualité. Si c'est pour que ce soit pixelisé, inutile.
La plupart des CSS sous GTmetrix disent " (expiration not specified) "
L'image de la bannière n’apparaît même pas, alors que c'est la seule qui met du temps à s'afficher sous Edge, à chaque chargement / changement de page.
Je peux éventuellement optimiser quelques .png, mais c'est pas ça qui fera une réelle différence ..
Édité par MickaelFR Le 02/07/2017 à 19h25
olivierb Membre non connecté
- Modérateur
- Voir le profil du membre olivierb
- Inscrit le : 07/02/2014
- Site internet
- Groupes :
- Equipe Assistance
Concernant " (expiration not specified) " : @Janus57 m'indique qu'il ne faut pas en tenir compte sachant que certain hébergeurs n'ont pas le " mod_expires " actif sur leurs anciennes offres mutu.
Pour le reste, Je ne peux aider mieux
Olivier.
Olivier
MickaelFR Membre non connecté
Booster Fusée
- Booster Fusée
- Voir le profil du membre MickaelFR
- Inscrit le : 20/01/2014
- Site internet
- Groupes :
L'image de la bannière apparait même pas dans les optimisation, donc je me demande ce qui cloche vraiment sous Edge. La bannière n'est pourtant pas lourde et en jpeg justement pour que ce soit moins lourd que le png.
Merci.
janus57 Membre non connecté
- Booster Fusée
- Voir le profil du membre janus57
- Inscrit le : 07/12/2007
- Groupes :
- Equipe Assistance
pour le score lié à "Leverage browser caching" je confirme que de mémoire (et cela se vérifie si le .htaccess n"a pas été touché) sur les vieille offre de nuxit cette optimisation n'est pas disponible.
Quant aux optimisation des images malheureusement gtmetrix à juste, elle peuvent encore être optimisés (sans que pour autant il y est des pixels de visible).
De plus il y a 2 images identique appelé par 2 url différentes par exemple.
Voici plusieurs tests pour montrer les points d'optimisation :
- https://gtmetrix.com/reports/planet-truck.fr/YawIZ2T7
- https://developers.google.com/speed/pagespeed/insights/?url=http%3A%2F%2Fplanet-truck.fr%2Fsite%2F
- https://www.dareboost.com/fr/report/5958f9990cf2b0eaff57b5c8
Note : par contre je trouve la page d'accueil plus lente niveau temps de génération PHP. Qu'est-ce qui est utilisé pour la page d'accueil ?
Cordialement, janus57
Visiteur
Boosteur Inactif
Si cela peut aider , voici ce que m'indique dare-boost:
Afin de vous aider à établir vos priorités d'optimisation, voici la répartition du poids de la page par type de ressources :
Images : 93,41% du poids total
Textes : 3,53% du poids total
JavaScript : 2,00% du poids total
CSS : 1,07% du poids total
Par ailleurs, voici les 10 ressources les plus lourdes qui sont téléchargées lors du chargement de votre page :
planet-truck.fr/site/templates/base-[...]images/header.jpg (726 ko)
http://planet-truck.fr/site/upload/nouvelle-autoroute-a9.jpg (676 ko)
planet-truck.fr/site/upload/homme-en[...]ident-04-2017.png (449 ko)
planet-truck.fr/site/upload/travaux-[...]36-dole-04-17.jpg (258 ko)
planet-truck.fr/site/templates/base-[...]-header-image.png (202 ko)
planet-truck.fr/site/kernel/lib/css/[...]ont.woff2?v=4.7.0 (78 ko)
http://planet-truck.fr/site/upload/homme-enjaune-travaux.jpg (52 ko)
http://planet-truck.fr/site/kernel/lib/js/global.js (49 ko)
http://planet-truck.fr/site/upload/actu-diverse.png (41 ko)
http://planet-truck.fr/site/upload/actu-securite.png (35 ko)
çà vaut ce que çà vaut ...
Je remarque ceci (mais je ne suis pas un pro)
Ton header est de 1920X682 et sur le css c'est indiquè : height: 280px;
background-image: url('/site/templates/base-v2-2016/theme/images/header.jpg');
background-position: 60% 14%;
height: 280px;
peut-être quelque chose à voir de ce côtè ...
Par ailleurs, tu peux utiliser ce site : http://compresspng.com/fr/ qui te permettra (qui sait) d'optimiser ces images.
bonne journée à tous.
Édité par Visiteur Le 03/07/2017 à 12h10
MickaelFR Membre non connecté
Booster Fusée
- Booster Fusée
- Voir le profil du membre MickaelFR
- Inscrit le : 20/01/2014
- Site internet
- Groupes :
Concernant le header, oui plus grande que la taille spécifiée. Je joue avec les positions avec les % % .. Mais je vais essayé de couper à 280px de hauteur, tout en essayant de conserver la position actuelle, ce qui n'est pas facile
Je vous tiens au courant
MickaelFR Membre non connecté
Booster Fusée
- Booster Fusée
- Voir le profil du membre MickaelFR
- Inscrit le : 20/01/2014
- Site internet
- Groupes :
janus57 :
Bonjour,
pour le score lié à "Leverage browser caching" je confirme que de mémoire (et cela se vérifie si le .htaccess n"a pas été touché) sur les vieille offre de nuxit cette optimisation n'est pas disponible.
Quant aux optimisation des images malheureusement gtmetrix à juste, elle peuvent encore être optimisés (sans que pour autant il y est des pixels de visible).
De plus il y a 2 images identique appelé par 2 url différentes par exemple.
Voici plusieurs tests pour montrer les points d'optimisation :
Note : par contre je trouve la page d'accueil plus lente niveau temps de génération PHP. Qu'est-ce qui est utilisé pour la page d'accueil ?
Cordialement, janus57
pour le score lié à "Leverage browser caching" je confirme que de mémoire (et cela se vérifie si le .htaccess n"a pas été touché) sur les vieille offre de nuxit cette optimisation n'est pas disponible.
Quant aux optimisation des images malheureusement gtmetrix à juste, elle peuvent encore être optimisés (sans que pour autant il y est des pixels de visible).
De plus il y a 2 images identique appelé par 2 url différentes par exemple.
Voici plusieurs tests pour montrer les points d'optimisation :
- https://gtmetrix.com/reports/planet-truck.fr/YawIZ2T7
- https://developers.google.com/speed/pagespeed/insights/?url=http%3A%2F%2Fplanet-truck.fr%2Fsite%2F
- https://www.dareboost.com/fr/report/5958f9990cf2b0eaff57b5c8
Note : par contre je trouve la page d'accueil plus lente niveau temps de génération PHP. Qu'est-ce qui est utilisé pour la page d'accueil ?
Cordialement, janus57
L'accueil du site, ou la page intro (index.php) ?
Sur l'accueil du site, rien que 4 flux, et news ..
olivierb Membre non connecté
- Modérateur
- Voir le profil du membre olivierb
- Inscrit le : 07/02/2014
- Site internet
- Groupes :
- Equipe Assistance
Juste pour info, je viens de suivre certaines optimisations (les images) proposées par "PageSpeed Insights" et les résultats sont plus que probants côté GTMetrix en passant d'un résultat global de 85% à 97%.
Tout cela sans aucune perte apparente de la qualité des images.
Il me reste à vérifier les JS mais là, avant de les mettre en ligne, je vais analyser les différences.
Olivier.
Olivier
MickaelFR Membre non connecté
Booster Fusée
- Booster Fusée
- Voir le profil du membre MickaelFR
- Inscrit le : 20/01/2014
- Site internet
- Groupes :
Je viens de réduire le header de 400ko à 180ko environ. Mais même soucis sur Edge. C'est surtout en passant de accueil au forum. Donc, c'est pas les images qui retardent, mais le forum sans doute.
Les images des actus (catégories), je laisse en png, car si je modifie, pas envie de repartir à zéro. Je garde mes calques. Si je compresse, même en png, je perd les claques. Et je vais pas avoir des doubles images exprès à chaque fois, c'est improbable.
janus57 Membre non connecté
- Booster Fusée
- Voir le profil du membre janus57
- Inscrit le : 07/12/2007
- Groupes :
- Equipe Assistance
pourquoi ne pas comprendre les images optimisé que propose GTMetrix ?
Sinon pour le fait que ce soit lent je parle bien de la page d'accueil du site vu que l'intro n'est que pure HTML/CSS.
Cordialement, janus57
MickaelFR Membre non connecté
Booster Fusée
- Booster Fusée
- Voir le profil du membre MickaelFR
- Inscrit le : 20/01/2014
- Site internet
- Groupes :
Pour les images, je viens d'expliquer la cause. Pour les PNG, je garde les calques. J'ai pas envie d'avoir des doublons à chaque fois. Puis à chaque fois qu'un membre insère une image, je vais pas passer derrière pour compresser (forum notamment).
Pour les catégories des news, je garde mes calques. Pour les images "fixes", je vais voir ce que je peux faire. J'ai refais un header spéciale mobile (780px max), ce qui réduit pas mal encore sous mobile.
Edit : Bon tans pis pour les calques, j'optimise, mais c'est saoulant de faire ça, chaque fois qu'on insère une actu (exemple) ..
Il y a cependant des choses que je peux rien y faire .. Je met souvent des lightbox .. Donc il critique le fait que je passe de 150px à 640px par exemple ..
Je peux rien faire pour le css non plus .. Pourtant mal noté .. (serveur?)
Édité par MickaelFR Le 03/07/2017 à 17h51
MickaelFR Membre non connecté
Booster Fusée
- Booster Fusée
- Voir le profil du membre MickaelFR
- Inscrit le : 20/01/2014
- Site internet
- Groupes :
En retirant les lightbox des actus, je passe de 40% à 85% .. Il y a un soucis quand même (y compris niveau JS dû au lightbox si j'ai bien compris) .. Mes images ne dépassent pas 640px en actu (150 en lightbox) et son compressées via un logiciel de réduction d'image (Image resizer).
Répondre
Vous n'êtes pas autorisé à écrire dans cette catégorie