前言
在开发和测试中或多或少会考虑产品在弱网情况下的表现,针对不同的平台,有不同的弱网模拟方案
弱网模拟:
- H5直接使用
Chrome
的弱网模拟功能 - iOS使用青花瓷(
charles
) - Android等,使用
Fiddle
使用Fiddler进行弱网模拟
- 打开Fiddler, 点击Rules --> Customize Rules;或者直接(Ctr + R)进入限速Code界面

- Ctrl+F弹出搜索框,搜索关键字
m_SimulateModem
,找到如下代码框,设置你想要模拟的网速::
if (m_SimulateModem) {
// Delay sends by 300ms per KB uploaded.
oSession["request-trickle-delay"] = "300";
// Delay receives by 150ms per KB downloaded.
oSession["response-trickle-delay"] = "150";
}
代码中:
request-trickle-delay
代表的是你网络请求的延迟时间;
response-trickle-delay
代表的是网络响应的延迟时间
手动设置上行,下行速率,模拟网路速度的原理,没上传/下载1KB要delay多久…
网络取值的算法:1000/下载速度 = 需要delay的时间(毫秒),比如下载50kb/s ,就需要delay200毫秒来接收数据。
上面的方式只是模拟一种稳定的网速,但实际情况中,网速是不稳定的,如果需要模拟这种情况,只需要修改代码如下:
static function randInt(min, max) {
return Math.round(Math.random()*(max-min)+min);
}
if (m_SimulateModem) {
// Delay sends by 300ms per KB uploaded.
oSession["request-trickle-delay"] = ""+randInt(1,2000);
// Delay receives by 150ms per KB downloaded.
oSession["response-trickle-delay"] = ""+randInt(1,2000);
}
当修改好后,Ctr + S
进行保存
- 设置完成后,需要手动打开弱网模拟功能,来启用新的设置
Rules – > Performances --> Simulate Modem Speeds

这时候用app进行弱网络条件操作:
选择第一个请求和最后一个请求,可以看到整个页面加载所消耗的时间。通过fiddler的记录能知道每个请求不同部分的请求时间。overall elapsed是整个session的时间。可以看出哪些请求耗时最对,从而对页面的访问进行访问速度优化。