2016-08-25 1 views
1

Je suis en train d'obtenir un bon score avec Google Charts, sur Google PageSpeed Insights, mais continuer à obtenir un message comme celui-ci:Comment obtenir un bon score sur Google PageSpeed ​​Insights avec Google API de visualisation

Éliminez JavaScript qui bloquent et CSS dans le contenu au-dessus de la ligne de flottaison Votre page contient 2 ressources CSS bloquantes. Cela provoque un retard dans rendant votre page. Environ 49% du contenu au-dessus de la ligne de flottaison sur votre page a pu être affiché sans attendre les ressources suivantes à charger. Essayez de reporter ou de charger de manière asynchrone les ressources bloquantes, ou insérez directement dans les parties critiques de ces ressources dans le code HTML. Optimiser CSS livraison des produits suivants: https://www.gstatic.com/charts/44/css/util/util.css https://www.gstatic.com/charts/44/css/core/tooltip.css

La chose étrange est que ces deux fichiers sont chargés après le rendu a commencé (selon webpagetest.org). Alors ces fichiers bloquent-ils vraiment le processus de rendu? Est-ce que quelqu'un a réussi à obtenir un bon score tout en utilisant Google Maps? Mon score actuel est de 51 pour le mobile et de 93 pour le bureau. Toute aide serait appréciée. Un peu d'humour que c'est le CSS de Google qui est à l'origine du problème.

Répondre

0

Regardez les numéros de demande 22 et 37



La demande 22 est l'endroit où commence la première peinture. Mais c'est une erreur car le navigateur n'a pas vu la requête 37 descendre le brochet.

Tous les fichiers CSS et polices doivent être liés avant tout JS.
Lorsque le navigateur a rencontré la demande 37, il a dû redémarrer le rendu. Le navigateur a besoin de toutes les CSS et polices avant de pouvoir commencer le rendu.

Notez que le DOM chargé (ligne verticale violette) se produit juste après le chargement de la requête 37. JS n'appartient pas au <head>, il devrait être placé après le HTML juste avant le </body>.

+0

Merci pour votre réponse. Le JavaScript est tout appelé async. Donc, ça ne devrait pas être un problème, je suppose. J'ai placé la plupart des CSS dans les balises