Comment mesurez-vous la vitesse de chargement des pages?
J'essaie de quantifier la "lenteur du site". Dans l'ancien temps, vous vous êtes simplement assuré que votre code HTML était léger, les images optimisées et les serveurs non surchargés. Dans les sites haut de gamme construits sur des systèmes de gestion de contenu modernes, il y a beaucoup plus de variables: publicité tierce, trackers et diverses autres légendes, les performances de CDN (assez intéressant parfois, les réseaux de diffusion de contenu aggravent les choses), l'exécution de javascript, la surcharge CSS , ainsi que toutes sortes de problèmes côté serveur comme les longues requêtes.
La réponse évidente est que chaque développeur vide le cache et regarde continuellement la section "net" du plugin Firebug. Quelles autres méthodes pour mesurer le "site drag ass" avez-vous utilisées?
Yslow est un outil (extension de navigateur) qui devrait vous aider.
YSlow analyse les pages Web et pourquoi elles sont lentes en fonction des règles de Yahoo! Pour les sites Web haute performance.
Firebug , le must have pour les développeurs web de l'extension Firefox, peut mesurer le temps de chargement de différents éléments sur votre page web. Au moins, vous pouvez exclure le CSS, le JavaScript et d'autres éléments prenant trop de temps à charger.
Si vous avez besoin de réduire les temps de chargement JavaScript et CSS, il existe différents compresseurs JavaScript et CSS sur le Web qui en retirent simplement le texte inutile, comme les caractères de nouvelle ligne et les commentaires. Bien sûr, gardez une version ordinaire de côté pour le développement.
Si vous utilisez des PNG, je suis récemment tombé sur un optimiseur PNG qui peut réduire les tailles PNG appelé OptiPNG .
Le "temps de chargement de la page" n'est vraiment pas facile à définir en général. Cela dépend du navigateur que vous utilisez, car différents navigateurs peuvent faire plus de demandes en parallèle, car javascript a des vitesses différentes dans différents navigateurs et parce que le temps de rendu est différent.
Par conséquent, vous ne pouvez vraiment mesurer le temps réel de chargement de votre page qu'en utilisant le navigateur qui vous intéresse. La fin du chargement de la page peut également être difficile à définir car il peut y avoir une demande Ajax après que tout soit visible sur la page. Est-ce que cela compte le chargement de la page ou non?
Et enfin et surtout, le temps de chargement réel de la page peut ne pas être très important car c'est la "performance perçue" qui compte. Pour l'utilisateur, ce qui compte, c'est quand il a suffisamment d'informations pour continuer.
Je ne connais aucun moyen (du moins non, je pourrais vous dire:]) qui mesurerait automatiquement le temps de chargement perçu de vos pages.
Utilisez AOL Pagetest pour IE et YSlow pour firefox (lien voir ci-dessus) pour obtenir une "sensation" pour votre temps de chargement.
Procurez-vous un bon proxy de débogage installé (je recommande vivement Charles )
Non seulement vous pourrez voir une répartition complète des temps/tailles de réponse, mais vous pouvez enregistrer les données pour une analyse/comparaison ultérieure, ainsi que jouer avec les demandes/réponses, etc.
(Edit: le support de Charles pour le débogage SOAP valent la somme dérisoire de ses frais de shareware - cela m'a sauvé une bonne demi-journée de perte de cheveux cette semaine seulement!))
J'utilise régulièrement webpagetest.org , que vous pouvez utiliser pour effectuer des tests de performances à partir de différents emplacements, sur différents navigateurs (bien que seulement msie 7-9), avec des paramètres différents (nombre d'itérations, vitesse de connexion, d'abord run vs 2nd visit, excluant les demandes spécifiques si vous le souhaitez, les informations d'identification si nécessaire, ...).
le résultat est n rapport très détaillé du temps de chargement des pages qui fournit également des conseils sur la façon d'optimiser.
c'est vraiment un excellent outil (gratuit)!
La dernière fois que j'ai travaillé sur un site Web à fort volume, nous avons fait plusieurs choses, notamment:
- Nous avons utilisé Yslow pour obtenir une analyse des facteurs individuels affectant le chargement de la page: https://addons.mozilla.org/en-US/firefox/addon/5369
- surveillance des performances à l'aide d'un outil commercial externe appelé Gomez - http://www.gomez.com/instant-test-pro/
- Nous avons testé les contraintes en utilisant une construction d'intégration continue, en utilisant Apache JMeter . http://jmeter.Apache.org/
Si vous voulez un coup d'œil rapide, disons une première approximation, j'irais avec YSlow et verrais quels sont les principaux facteurs affectant le temps de chargement des pages dans votre application .
PageSpeed est un outil de vérification en ligne de Google, qui est très précis et fiable:
Eh bien, appelez-moi à l'ancienne mais ..
time curl -L http://www.example.com/path
sous linux :) A part ça, je suis un grand fan de YSlow comme mentionné précédemment.
YSlow comme mentionné ci-dessus.
Et combinez cela avec Fiddler. C'est bien si vous voulez voir quels objets de page prennent le plus de bande passante, qui sont compressés sur le serveur, les allers-retours inattendus et ce qui est mis en cache. Et cela peut vous donner une idée générale du temps de traitement dans le navigateur Web du client par rapport au temps pris entre le serveur et le client
Si c'est asp.net, vous pouvez utiliser Trace.axd.
Yahoo fournit yslow qui peut être idéal pour vérifier le javascript
Il existe évidemment plusieurs façons d'identifier le temps de réponse, mais le défi a toujours été de mesurer le temps de rendu passé dans le navigateur.
Nous avons une phase de test contrôlée dans laquelle nous utilisons plusieurs outils automatisés pour tester l'application. L'une des sorties que nous générons à partir de ce test est une trace de violoneux pour chaque transaction (un clic). Nous pouvons ensuite analyser la trace du violoniste pour comprendre l'heure du dernier octet et la soustraire avec le temps total pris par la page.
Quelque chose comme ça 1. A = Temps de réponse total tel que mesuré par un outil automatisé (dans notre cas, nous utilisons QTPro) 2. B = Temps jusqu'au dernier octet (Temps serveur + réseau, à partir de la trace du violoneux) 3. C = AB ( temps de rendu approximatif, OR le temps passé dans le navigateur)
Tout ce que j'ai expliqué ci-dessus peut devenir un processus de test standard et à la fin du test, nous pourrions générer une répartition du temps passé à chaque couche, par exemple temps de rendu, temps réseau, appels de base de données etc ...
Yslow est bon, et HttpWatch pour IE est également très bien. Cependant, les deux manquent la métrique la plus importante pour un utilisateur "Quand est la page -au-dessus du pli - prêt à l'emploi pour l'utilisateur? ". Je ne pense pas que ce soit encore résolu ...
Apache Benchmark . Utilisation
ab -c <number of CPUs on server> -n 1000 url
pour obtenir une bonne approximation de la vitesse de votre page.
Dans Safari , le Chronologie du résea (disponible dans le menu Développer, que vous devez activer spécifiquement) donne des informations utiles sur le temps de chargement des composants de page individuels, ainsi que montrant quand chaque composant a commencé le chargement.