web-dev-qa-db-fra.com

Page Speed ​​Online vs Chrome Extension

En optimisant un de mes blogs de contenu dans le but d’atteindre le score de vitesse de page le plus élevé possible pour des raisons évidentes (expérience utilisateur, référencement, etc.), les résultats que j’obtiens sont en train de me lancer.

Par souci d’exhaustivité, voici my stack:

  • DNS + CDN CloudFlare
  • nginx 1.0.11 stable
  • PHP-FPM 5.3.6
  • WordPress dernière version stable (3.3.1)
  • WP-Super Cache

Passer à autre chose ...

À l'origine (I) utilisais Page Speed ​​Online pour que Google raccroche l'URL racine et voie ce qu'il a généré, car je pensais que ce serait la représentation la plus précise de la vitesse à laquelle elle s'est réalisée lorsque évaluer le site Web à des fins de référencement. Cependant, les résultats sont ... intriguants pour le moins. J'ai regardé les en-têtes de manière extensive (sessions, utilisateurs anonymes, en cache vs non-en cache, etc.) Cependant, Page Speed ​​Online semble signaler des résultats incorrects.

Après avoir purgé chaque cache que j'avais et toujours sous les mêmes recommandations amusantes de Page Speed ​​Online, j'ai essayé l'extension Chrome. Voici mes conclusions:

  • Page Speed ​​Online indique que je devrais " tirer parti de la mise en cache du navigateur " pour la majorité de mes actifs statiques, citant que le expire. la durée sur la majorité d'entre eux est de 24h ou moins, malgré le fait que je puisse reproduire à plusieurs reprises l'affichage des en-têtes et vu que la date d'expiration est réglé correctement pour 1 semaine comme je l’ai dans ma configuration nginx. Ceci s’applique à .js, .css. png, .jpg, etc ....

    • En outre, CloudFlare indique qu'il respecte les en-têtes d'expiration dépassant la valeur par défaut 4h, ce qui ne semble pas poser de problème.
  • With CloudFlare Enabled, Page Speed ​​Online rapporte un score de 75, avec seulement 2 critiques de priorité moyenne (dont l'une est la mise en cache ci-dessus " issue ", ce qui n'est pas valide) et une priorité basse. Sans CloudFlare activé, j'obtiens un score de 88 avec les mêmes 2 recommandations de priorité moyenne, mais au lieu de 9 priorité (ex: j’avais CloudFlare qui gérait la minification des actifs statiques, chargeait une partie du JavaScript, de manière asynchrone, etc.).

    • N'oubliez pas qu'il s'agit d'une [micro-instance EC2 32 bits de 613 Mo] avec de mauvaises performances d'E/S et de courtes rafales de processeur. Certes, je cache beaucoup de voyages sur le disque, mais un 88 sans CloudFlare et 75 avec ?


Avance rapide sur Vitesse de la page Chrome Extension ...

  • Pas de contenu en cache, pas de CloudFlare: 94
    • (1 priorité moyenne, 9 priorité basse)
  • Page en cache côté serveur, pas de CloudFlare: 95
    • (0 priorité moyenne, 9 priorité faible)
  • Aucune page en cache côté serveur, avec CloudFlare): 92
    • (2 priorités moyennes, 7 priorités faibles)
  • Page en cache côté serveur, avec CloudFlare): 96
    • (0 priorité moyenne, 7 priorité faible)

Juste pour être clair, le cache local (mis en cache par Chrome) a été effacé avant l'exécution de tout ce qui précède.

Dans le cas du first ​​et du third, j'ai exécuté le test en tant qu'administrateur avec une session et n'était pas servi la page Super Cache. Pour le second et quatrième, j'ai vérifié que le cache côté serveur était rempli et j'ai demandé à la page en tant qu'utilisateur anonyme (et était a ensuite servi la page en cache).

Dans le cas des requêtes not ​​en utilisant CloudFlare, aucune minification n'était présent pour le premier, et seule la minification HTML pour le seconde.

Pour les tests sing CloudFlare, les minifications HTML, CSS et JavaScript ont été effectuées/servies automatiquement. De plus, les ressources ont été combinées et requises de manière asynchrone, le cas échéant. En outre, tous les actifs statiques étaient mis en cache et servis par le CDN CloudFlare plutôt que par l'instance EC2 . La seule " cache distinction " que je faisais dans ces deux tests était le cas d'une version super cache de la page dynamique présent en mémoire ou non (présent && hit).


Ouf.
(Il a fallu à peu près aussi longtemps pour citer ceci verbalement que pour le tester).


Je dis tout cela pour poser les questions suivantes:

  1. Pourquoi Page Speed ​​Online donne-t-il des résultats aussi géniaux?

    Pas précis, mais en outre, la disparité majeure entre utiliser CloudFlare et non, complètement est contre-intuitive.

  2. Vous pouvez voir ci-dessus la différence jour et nuit entre Page Speed ​​Online et Extension de la page Chrome. Quelle est une représentation plus précise de la façon dont l'algorithme de Google classerait votre page en ce qui concerne la vitesse?

    J'espère vraiment que c'est ce dernier :)

  3. Qu'est-ce qui donne avec CloudFlare un score inférieur dans les cas en ligne et dans les cas d'extension sans une page en cache statique côté serveur?

    Intuitivement, je m'attendrais à ce que les nombreux avantages de performance que CloudFlare offre au moins soient supérieurs à les variations d'un test non-CloudFlare (minification de JS, CSS, HTML, CDN pour tous les actifs statiques , y compris des images (une partie importante du charge utile), chargement asynchrone, etc ... Qu'est-ce qui donne?


Je vous félicite si vous avez réussi à lire et à rester attentif jusqu'à présent. Merci beaucoup pour votre temps et votre considération, et j'apprécie toutes les idées que n'importe qui peut fournir à l'avance!

Juste pour des raisons de transparence, j'ai également posté ceci sur Quora .

5
Dan Simmons

Remarque: je réponds sur la base de ce que vous avez décrit ci-dessus uniquement (ce qui, bien que descriptif, n’est pas la même chose que d’analyser la ou les sources).

A vos questions ci-dessus:

  1. De propre FAQ de Google Page Speed :

    Certaines des suggestions diffèrent des extensions du navigateur Page Speed. Pourquoi?
    Page Speed ​​Online utilise un moteur de rendu et un agent d'utilisateur différents, ce qui peut avoir une incidence sur le contenu extrait pour un site.

    En quoi Page Speed ​​Online est-il différent des extensions de navigateur Page Speed? Lequel dois-je utiliser?
    Page Speed ​​Online fournit la même analyse que les extensions de navigateur Page Speed ​​pour Chrome et Firefox, sans qu'il soit nécessaire d'installer une extension de navigateur.

    Ensuite, vous devez comprendre que CloudFlare (que j'utilise) peut/modifie effectivement certains en-têtes HTTP des éléments demandés/auxquels il est répondu - en-têtes d'expiration, etags, etc. En outre, les cookies sont attachés à des domaines non-cookied .

  2. Ni. Je ne considérerais pas la mesure de Google comme "autoratative" mais uniquement "représentative". Il existe d'autres méthodes/tests tels que http://webpagetest.org , http://pingdom.com etc qui peuvent vous donner d'autres résultats géo-spécifiques.

  3. Comme mentionné ci-dessus, CloudFlare ajoute des données supplémentaires mineures (cookies, etc.) à l'ensemble de votre page. Ceci devrait être compensé par sa capacité CDN et d'autres éléments importants tels que TTFB (Time to First Byte) qui ont un impact plus rapide sur la vitesse.

Comme je l'ai mentionné, j'utilise CloudFlare sur un certain nombre de sites et je les ai optimisés pour la vitesse (et la vitesse de la page) à près de 100. Ce qu'il faut retenir, c'est que même avec un score parfait de 100, vous pouvez toujours avoir un site lent. En fait, la valeur réelle "vitesse" utilisée par Google à des fins de référencement est barre d'outils personnelle (plus ici ).

Si vous voulez vraiment vous attaquer à la vitesse, vous devez vous adresser à d'autres porcs de deuxième rang - je recommande http://zoompf.com pour vous en prendre à tous les autres problèmes. Enfin, la vitesse du serveur a beaucoup à voir avec les choses - pas seulement le traitement final, mais également la connectivité.

Je ne suis pas le site le plus technique du monde, mais j'espère que cela m'a aidé.

5
Mike Hudson