Chrome开发者工具可模拟不同网络条件，首先打开开发者工具进入Network面板，通过下拉菜单选择预设节流配置如Slow 3G，或自定义下载上传速度及延迟，还可启用Offline模式测试离线状态下的页面表现。
如果您需要测试网站在不同网络条件下的加载表现，Chrome浏览器内置的开发者工具提供了强大的网络状况模拟功能。通过该功能，您可以轻松模拟从高速宽带到缓慢的2G网络等各种连接状态。
本文运行环境：MacBook Pro，macOS Sonoma
一、打开开发者工具并进入网络面板
要使用网络状况模拟功能，首先需要调出Chrome的开发者工具，并导航至网络（Network）标签页。这是进行网络监控和模拟的主界面。
1、在Chrome浏览器中访问您想要测试的网页。
2、按下 Option + Command + I 快捷键，或右键页面选择“检查”来打开开发者工具。
3、在开发者工具顶部的标签栏中，点击 Network 选项卡以进入网络监测面板。
二、启用并选择预设网络节流配置
Chrome提供了多个预设的网络速度配置，可快速模拟常见的网络环境，如慢速3G、快速3G或离线状态。这些预设简化了测试流程，无需手动输入参数。
1、在Network面板的顶部控件栏中，找到标有 No throttling 的下拉菜单。
2、点击该下拉菜单，从列表中选择一个预设配置，例如 Slow 3G 或 Fast 3G。
3、刷新页面后，您将观察到资源加载速度显著变慢，模拟了相应网络条件下的用户体验。
三、自定义网络节流参数
当预设配置无法满足特定测试需求时，您可以创建自定义的网络节流方案，精确控制下载速度、上传速度和延迟等参数。
1、在Network面板的节流下拉菜单中，选择 Add 以创建新的自定义配置。
2、在弹出的窗口中输入配置名称，例如“Poor LTE”。
3、设置所需的 Download (kbps)、Upload (kbps) 和 Latency (ms) 数值。
4、点击“Add”保存配置，之后即可在下拉菜单中选择该自定义方案进行测试。
四、模拟离线网络状态
为了测试网页在完全无网络连接情况下的行为，例如PWA应用的缓存回退机制，可以使用离线模式模拟功能。
1、在Network面板的节流下拉菜单中，选择 Offline 选项。
2、刷新页面后，所有网络请求将被阻止，浏览器显示为离线状态。
3、此时可验证页面是否能正确展示离线提示或加载缓存内容。
