Simulating low-speed network environment with fiddler

Sometimes the broadband network is used to ...

In the development process is relatively less to consider the problem of optimization ...

But when someone responds, "Your Web page is slow".
Even when the internet is slow, it will cause your page to jump out of what is not a bug when how to reproduce it?

We can use fiddler this powerful set of Web Debugging Tools ...

Fiddler is a Web debugging agent. It can record HTTP requests between all clients and servers, allow you to monitor, set breakpoints, and even modify input and output data, Fiddler contains a powerful event-based scripting subsystem, and is able to use the. NET Framework language extension. More detailed information we can on the official website of fiddler to understand, http://www.fiddler2.com/fiddler2/, the above details the Fiddler usage and extension.

Why do we need speed limits?

Speed limit for the Web front-end development is very important, because the developer's machine is generally very high, and is in localhost down the debugging program, it is difficult to simulate the user's real use, such as the download of static resources such as JS,CSS, a rendering of the page. When the network speed is very slow, we would like to see the first rendering of the user interface, rather than let the user see a blank. At this time, the network speed limit can be very convenient in localhost for similar situations to do performance tuning and optimization.

Fiddler the principle of analog speed limit

We can simulate the speed limit by Fiddler, because Fiddler is an agent that provides callback interfaces before and after the client's request, and we can customize some logic in these interfaces. Fiddler's analog Speed limit is the logic that defines the speed limit before the client requests it, which restricts the download speed and upload speed of the network by delaying the sending of data or receiving data, thus achieving the speed limit effect.
He provides a feature that allows us to simulate low-speed network environments ... The Enable method is as follows:
Rules→performances→simulate Modem Speeds (e.g.)

After checking, you will find that your network is very slow in the moment ...
(Think of the country when the speed of our network is a way down the son come ah ...)

If you think the simulation is slowing down to an explosion, don't make sense ...
You can also define your own modem Speeds how fast ...
Open rules→customize Rules (e.g.).

To find the word m_simulatemodem, you will find the following paragraph:

This is how he simulates the speed of the network, each upload/download 1KB how long to delay ...
If you are accustomed to using Kbps, then our algorithm is 1000/download speed = time delay (milliseconds), such as 50kb/s need delay200 milliseconds to receive data.

Delay sends by 300ms per KB uploaded.osession["request-trickle-delay"] = "+";//delay receives by 150ms per KB Downlo aded.osession["Response-trickle-delay"] = "150";

Please note that when you archive, the simulate Modem Speeds that was already checked will be unchecked,
Remember to Rules→performances→simulate Modem Speeds!

The same field as: Let fiddler only for a process debugging

Take windows, for example, after the Fiddler is opened, as long as the "Internet Options" program (ie, Chrome) under IE.
Preset all traffic goes through fiddler
If you think you're trying to simulate a low-speed internet connection, don't want to affect other programs ...
You can specify fiddler only for a process Debug ...
The method is to pull the Fiddler window, which is like a bull's-eye, to the program you want to debug (e.g.).

By your bull's eye to pull the program, in a moment there will be "electric shock" feeling such as XD

When you release the mouse, Fiddler will only monitor the process you specified.

Other fiddler small tricks (from vexed ' s Blog)

Fiddler replace the online file with a native-side file or another online file

First, replace the online file with the native side file. The method is to click on the autoresponder on the right of fiddler, tick Enable automatic responses and unmatched requests Passthrough, press add on the right:

Then modify the first line of the rule Editor below to the online file address:

Online file addresses can also use regular Expression, beginning with regex: Yes.

Press the arrow on the right of the second line of the rule Editor to select Find a file ... ：

Select the native side file you want to replace, and press Save on the right:

Done!

To replace the online file with another online file, the steps are almost identical, and the difference is only filled in the second line of the rule Editor with another line of file addresses:

Thank you for introducing autoresponder so good things m (__ __) m.

For more autoresponder instructions, please refer to fiddler official documents-Autoresponder Reference.

Fiddler replacing the HTTP Request Host

The replacement HTTP request host here is, all the HTTP request that was originally sent to A.com, Fiddler will forward to B.Com for you, and in the browser without feeling. This is often required during the test debug process, such as replacing www.demo.com with www. dev.demo.com.

There are two ways of replacing, one is temporary and one is permanent. The temporary method is to enter in the lower left corner of the fiddler:

Code from HTTP://CAIBAOJIAN.COM/FIDDLER.HTML#T4  urlreplace www.demo.com www.dev.demo.com

Press Enter and all HTTP Request that was originally sent to www.demo.com is forwarded to www.dev.demo.com.

To clear the forwarding, enter it in the same location:

  Urlreplace

Press ENTER to do so.

For more detailed instructions, please refer to fiddler official documentation-Quickexec Reference. You can see that urlreplace is replacing the entire URL string, so it's not the only place where you can get your hands on your feet.

The permanent method is to modify the customrules of the fiddler. JS, attention is. js! Point to the rules above Fiddler, and then point to customize rules:

If you have installed Fiddlerscript editor, you will use Fiddlerscript editor to open the Customrules.js, otherwise you will open with a notebook. Or, you can edit customrules.js directly into my files Fiddler2 scripts".

Please find it at Customrules.js first:

  static function Onbeforerequest (osession:session) {   //...}

In the function onbeforerequest, add:

  if (osession. Hostnameis (' www.demo.com '))   osession. hostname = ' www.dev.demo.com ';

The customrules.js is archived, Fiddler automatically re-loaded customrules.js, and the HTTP Request originally sent to www.demo.com is automatically forwarded to www.dev.demo.com.

For more detailed instructions, please refer to the Fiddler official documentation-Script Samples.

Simulating low-speed network environment with fiddler