Categories: Uncategorized

Simulate slow connections with the network throttling tool

Network throttling UI

Firefox DevTools has now a network throttling tool to simulate slow connections, so you can get a rough idea of the user experience under different connection types (bug #1283453).

This is extremely important when building responsive sites, which are meant to perform well on many different devices and scenarios.

To access this tool, make sure you’re running an updated version of Nightly, then open the Responsive Design Mode tool via ToolsWeb DeveloperResponsive Design Mode. You can then select the desired simulated speed with the dropdown menu to the right of “Responsive Design Mode”, and reload the page to see the effect of the changes.

And if you want to find out what is being loaded, use this tool in combination with the Network inspector:

16 comments on “Simulate slow connections with the network throttling tool”

Post a comment

  1. Gervase Markham wrote on

    Does it also simulate increased latency as well as reduced speed?

    Reply

    1. J. Ryan Stinnett wrote on

      Yes, all of the different connection profiles reduce speed and increase latency to some degree.

      Reply

  2. raymondcamden wrote on

    Why no Offline setting too?

    Reply

    1. J. Ryan Stinnett wrote on

      Offline will be handled in different way than the throttling profiles, and that portion hasn’t been implemented yet. Follow https://bugzilla.mozilla.org/show_bug.cgi?id=1156659 for details on the offline feature.

      Reply

  3. Albert wrote on

    Great that this feature made it into DevTools 🙂
    Just wondering, wouldn’t it make more sense in the networks panel? I mean I see the logic behind speed settings in RDM to simulate being on the go with a mobile device, but if I want to mimic a slow network to i.e. force a loader (spinner, etc.) to test it, RDM has to now be activated first.

    Reply

    1. Dragos wrote on

      I totally agree with that. I sometimes need to test the website for desktop devices with slow connection, so that will be more useful! 🙂

      Reply

    2. Fred wrote on

      Has this made it into the more stable builds yet?

      Reply

    3. Mark wrote on

      Yes, absolutely agree! We have to test our desktop web app for slow connections too. It’d be great if you added the same dropdown as in RDM to the network tab!

      Reply

    4. Chris wrote on

      In complete agreement on this, personally I think it makes very little sense hiding it behind RDM. Not only do I frequently want to test out slow connections on desktop sites, it can also be very useful for checking a page’s loading behaviour.

      Chrome’s implementation strikes me as a far better way of doing it.

      Reply

  4. fred wrote on

    Btw another reason this should be a standard feature, large uploads to google drive on bad connections/cheap routers can wipe out internet access unless throttled.
    Chromes version of this feature is useful for this as well.

    Reply

  5. Jay Shan wrote on

    I am using Firefox (regular edition) Version: 50.1 when I go to Tools>Web Developer>RDM I don’t see throttling tool option as mention in the above screen shot. Anybody has any idea.

    Reply

  6. Shyam wrote on

    What does it means, “make sure you’re running an updated version of Nightly”

    Reply

  7. Pari wrote on

    I have the most recent version, but I still don’t see this option!

    Reply

  8. Zach Steffens wrote on

    I have tried running the nightly and the newest stable and I do not see this feature.

    windows 7.
    51.0.1

    Reply

    1. Soledad Penadés wrote on

      The responsive design mode is only available when running Firefox in with e10s (electrolysis) enabled. Otherwise you might get a “Responsive design mode is only available for remote browser tabs” error on top.

      e10s should be enabled on Nightly/Developer Edition unless you have disabled it manually. Instructions are here https://wiki.mozilla.org/Electrolysis#Nightly.2FAurora

      I have just tried opening the option with a Windows 10 laptop and Nightly and Responsive Design Mode opens as expected, and the throttling option is also displayed.

      Remember to use Nightly. This is not available in Firefox stable yet.

      Reply

  9. laser wrote on

    Awesome. Works

    Reply

Post your comment