Simuler une bande passante limitée depuis Chrome?


202

Existe-t-il un moyen de simuler différentes vitesses de connexion depuis Chrome?

Je dois pouvoir vérifier http: // localhost avec des vitesses variables.

Je sais qu'il existe des applications autonomes qui peuvent le faire, mais je préfère le faire dans Chrome.


Une extension n'a certainement pas ce niveau d'accès. Chrome ne fournit que des API d'extension pour les tâches les plus courantes et ce n'est pas l'une d'entre elles.
Wladimir Palant

Commander webpagetest.org . Vous pouvez définir la vitesse de connexion sous test settings / connection.
Benjamin Crouzier

Réponses:


117

Je recommanderais Charles Proxy - vous pouvez choisir de ralentir les sites individuels, a également tout un tas d'outils d'inspection HTTP.

Éditer:

Depuis juin 2014, Chrome a désormais la possibilité de le faire en mode natif dans DevTools - vous aurez cependant besoin de Chrome 38.

L'option est accessible à partir de l'onglet Réseau via un menu déroulant à la fin de la barre d'outils.


69
Un avertissement: Charles n'est pas libre
Charlie

8
Où trouvez-vous cela dans chrome devtools?
Paul

15
Lancez DevTools aux Canaries, le long du haut, vous avez l'icône de recherche, l'icône du téléphone, les éléments, le réseau, etc. Cliquez sur l'icône du téléphone, puis choisissez Émulation dans le panneau inférieur, les options d'émulation du réseau sont dans ce panneau
Andy Davies

1
@Andy ughh ... Comment avez-vous fait apparaître l'icône du téléphone? Ils continuent de faire bouger les choses aux Canaries ...
Nathan

36
Malheureusement, la limitation dans Chrome ne fonctionne qu'avec les téléchargements, pas les téléchargements.
JesseBuesking

140

Si vous utilisez Linux, la commande suivante est vraiment utile pour cela:

trickle -s -d 50 -w 100 firefox

Le -sindique à la commande de s'exécuter de manière autonome, le lui -d 50indique de limiter la bande passante à 50 Ko / s et de -w 100définir la taille de la fenêtre de détection de pic à 100 Ko. firefoxindique à la commande de démarrer Firefox avec toutes ces limitations de taux appliquées à tous les sites qu'il tente de charger.

Mettre à jour

Chrome 38 est maintenant disponible et inclut la limitation. Pour le trouver, affichez les outils de développement: Ctrl + Maj + je le fais sur ma machine, sinon Menu-> Plus d'outils-> Outils de développeur vous y amènera.

Basculez ensuite en mode appareil en cliquant sur le téléphone dans le coin supérieur gauche du panneau des outils du développeur (voir l'infobulle ci-dessous).

Basculer le mode appareil

Activez ensuite la limitation comme ceci.

Activer la limitation de Chrome

Si vous trouvez cela un peu maladroit, ma suggestion ci-dessus fonctionne pour Chrome et Firefox.


J'ai essayé la fonctionnalité de développement dans Chrome et téléchargé une vidéo YouTube. Il ne semblait pas du tout limiter le téléchargement.
WHol

1
La fonction d'accélération n'est pas un limiteur de téléchargement. C'est pour tester les téléchargements et voir comment votre page se charge sur une connexion différente.
Nelson

68

À partir de Chrome 38, vous pouvez le faire sans aucun plug-in. Cliquez simplement sur inspecter l'élément (ou le F12raccourci clavier), puis cliquez sur toggle device mod(le phonebouton)

entrez la description de l'image ici

et vous verrez quelque chose comme ça:

entrez la description de l'image ici

Parmi de nombreuses autres fonctionnalités, il vous permet de simuler une connexion Internet spécifique (3G, GPRS)


14
Cela semble bien fonctionner pour les tests de chargement de page, mais le test de téléchargement (à l'aide de xmlhttpreq2) ne semble pas être limité. - hors ligne et sans limitation travaillé, mais pendant le téléchargement du processus semble ignorer les limites GPRS etc - ce serait bien si le téléchargement pourrait également être mis en forme afin que nous puissions tester les barres de progression, les délais d' attente , etc.
Josh Mc

2
C'est correct, c'est un problème en suspens code.google.com/p/chromium/issues/detail?id=414319
Calin

61

À partir d'aujourd'hui, vous pouvez limiter votre connexion en natif dans Google Chrome Canary 46.0.2489.0. Ouvrez simplement Dev Tools et rendez-vous sur l'onglet Réseau:

entrez la description de l'image ici


1
C'est l'itinéraire le plus simple et ne nécessite aucun plugin supplémentaire.
earl3s

2
Mais cela n'a aucun effet sur les websockets.
Tom Hubbard

19

Comme Michael l'a dit , l'API d'extension Chrome n'offre pas un moyen fiable de le faire. D'un autre côté: il y a un logiciel que j'utilise moi-même depuis un certain temps.

Essayez Sloppy , une application Java qui simule une faible bande passante. Il est indépendant du navigateur, il est très facile à utiliser et, surtout, c'est gratuit!


13

Si vous êtes sur un Mac, l'équipe de développement Chrome recommande l '«Outil de conditionneur de liaison réseau»

Soit:

Xcode > Open Developer Tool > More Developer Tools > Hardware IO Tools for Xcode

Ou si vous ne souhaitez pas installer Xcode:

Go to the Apple Download Center and search for Hardware IO Tools

https://developer.apple.com/downloads/index.action


Pour rechercher des outils IO matériels sur le site d'Apple à partir de mars 2016, cliquez sur ce lien . Le volet de préférences "Conditionneur de liaison réseau" vous permet de définir la bande passante de liaison descendante et montante, le% de paquets abandonnés et le délai.
Greg Sadetsky

11

Dans Chrome Canary, vous pouvez désormais limiter le débit du réseau. Cela peut être fait dans les options "Réseau" de l'onglet "Emulation" de la console dans les outils de développement. Vous devrez peut-être activer l'indicateur Chrome "Activer les expériences des outils de développement" (chrome: // flags / # enable-devtools-experiences) (chrome: // flags) pour voir cette nouvelle fonctionnalité. Vous pouvez simuler une faible bande passante (GSM, GPRS, EDGE, 3G) pour les connexions mobiles.


Ceci est si facile à utiliser et fonctionne également sur localhost sans aucune configuration supplémentaire. Excellente suggestion.
HockeyJ

2
Je ne peux pas faire fonctionner cela, j'ai activé le drapeau mais aucune option réseau ne s'affiche dans l'émulation sous les outils de développement, est-ce uniquement Windows?
Pez Cuckow

6

Article d'origine: https://helpdeskgeek.com/networking/simulate-slow-internet-connection-testing/

Simuler une connexion lente à l'aide de Chrome Allez-y et installez Chrome si vous ne l'avez pas déjà installé sur votre système. Une fois que vous le faites, ouvrez un nouvel onglet, puis appuyez sur CTRL + MAJ + I pour ouvrir la fenêtre des outils de développement ou cliquez sur l'icône du hamburger, puis sur Plus d'outils puis sur Outils de développeur.

entrez la description de l'image ici

Cela fera apparaître la fenêtre des outils de développement, qui sera probablement ancrée sur le côté droit de l'écran. Je préfère qu'il soit ancré au bas de l'écran car vous pouvez voir plus de données. Pour ce faire, cliquez sur les trois points verticaux puis cliquez sur la position centrale du quai.

entrez la description de l'image ici

Allez-y maintenant et cliquez sur l'onglet Réseau. Sur la droite, vous devriez voir une étiquette appelée No Throttling.

entrez la description de l'image ici

Si vous cliquez dessus, vous obtiendrez une liste déroulante d'une vitesse préconfigurée que vous pouvez utiliser pour simuler une connexion lente.

entrez la description de l'image ici

Les choix vont de Hors ligne au WiFi et les chiffres sont affichés comme Latence, Téléchargement, Téléchargement. Le plus lent est le GPRS suivi du Regular 2G, puis du Good 2G, puis du Regular 3G, du Good 3G, du Regular 4G, du DSL et du WiFi. Choisissez l'une des options, puis rechargez la page sur laquelle vous vous trouvez ou saisissez une autre URL dans la barre d'adresse. Assurez-vous simplement que vous êtes dans le même onglet où les outils de développement sont affichés. La limitation ne fonctionne que pour l'onglet pour lequel vous l'avez activé.

Si vous souhaitez utiliser vos propres valeurs spécifiques, vous pouvez cliquer sur le bouton Ajouter sous Personnalisé. Cliquez sur le bouton Ajouter un profil personnalisé pour ajouter un nouveau profil.

entrez la description de l'image ici

Lors de l'utilisation de GPRS, le chargement de www.google.com a pris 16 secondes! Dans l'ensemble, il s'agit d'un excellent outil intégré à Chrome que vous pouvez utiliser pour tester le temps de chargement de votre site Web sur des connexions plus lentes. Si vous avez des questions, n'hésitez pas à commenter. Prendre plaisir!


1
Bonne réponse, Arbaz!
Matt

1
Détaillé et approfondi! Merci!
SexyBeast

4

si vous n'êtes pas familier avec Fiddler - veuillez le faire. C'est un excellent outil de débogage pour HTTP. Vous avez également la possibilité de limiter la bande passante.


Deuxièmement que ... Fiddler est génial. Voici un lien vers une réponse connexe concernant la limitation et l'ajout de retards dans Fiddler. stackoverflow.com/questions/16276669/…
JustinParker

1

Je ne pense pas que ce que vous demandez puisse être fait uniquement par le chrome. Le plus proche que j'ai pu trouver était celui-ci , qui n'est pas ce que vous voulez. Obtenir un plugin Chrome pour le faire serait difficile.

Un proxy Web s'exécutant sur votre ordinateur local pourrait obtenir l'effet souhaité. Une recherche de « proxy étranglant » est venu avec ce , par exemple.



1

Si vous utilisez OSX, vous pouvez utiliser: Conditionneur de liaison réseau

entrez la description de l'image ici

Ici, vous pouvez sélectionner différents profils, par exemple. 100% de perte, 3G, DSL, etc.

Veuillez trouver le lien ci-dessous pour télécharger le conditionneur de lien réseau ici


-3

Remarque, n'utilisez pas le testeur de vitesse intégré de Chrome (il vous montrera la vitesse non limitée). Utilisez plutôt un autre site, comme Fast.com. Cela vous montrera des vitesses étranglées correctement.

De plus, les paramètres de limitation peuvent être masqués et accessibles à partir de la barre de réseau en cliquant sur la petite flèche vers le bas.


1
Salut @Dandelion. Merci de prendre le temps de répondre. Je ne suis pas sûr que cette réponse soit appropriée comme réponse, car elle ne répond pas réellement à la question. Qu'est-ce que le test de vitesse a à voir avec la question? Comment peut- fast.comon l'utiliser sur localhost?
Benjamin
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.