步骤一：通过开发者工具监控网络请求
按下`Ctrl+Shift+I`打开开发者工具，切换到“Network”标签页。访问目标网页后，工具会记录所有资源加载情况。点击“Waterfall”图表中的条目（如图片、脚本），可查看单个资源的传输时间、数据大小（如`50KB`）及HTTP状态码（如`200`）。右键点击条目并选择“Reveal in Console”可定位到具体请求的日志信息。
步骤二：使用扩展程序统计带宽占用
安装扩展“Data Saver Extension”，在设置中启用“详细统计模式”。访问网页时，扩展图标会显示实时流量（如`1.2MB/s`），点击图标可查看各资源类型占比（如视频占70%）。若需导出数据，点击“生成报告”并保存为CSV文件，包含时间戳、域名、传输大小等字段。
步骤三：捕获完整请求日志并分析
在开发者工具的“Console”标签页中输入以下代码：
javascript
(function() {
const log = [];
const originalFetch = window.fetch;
window.fetch = function(...args) {
log.push({type: 'fetch', url: args[0], time: new Date().toISOString()});
return originalFetch(...args);
};
XMLHttpRequest.prototype.originalOpen = XMLHttpRequest.prototype.open;
XMLHttpRequest.prototype.open = function(...args) {
log.push({type: 'xhr', url: args[1], time: new Date().toISOString()});
this.originalOpen(...args);
};
})();
刷新页面后，所有网络请求会被记录在`log`数组中，右键点击控制台可保存日志为本地文件。
步骤四：过滤特定类型的网络请求
在开发者工具的“Network”标签页中，点击“Filter”栏并输入关键字（如`.mp4`或`.js`），仅显示匹配的资源。若需分析第三方域名请求，勾选“Block cookies and site data”后刷新页面，可对比禁用缓存前后的带宽变化。对于重复请求，右键点击条目并选择“Block URL”可阻止其再次加载。
步骤五：通过命令行工具抓取全链路日志
在Windows系统中使用`netsh`命令捕获网络包：
bash
netsh trace start persistent=yes overwrite=yes
访问目标网页后，执行：
bash
netsh trace stop
生成的`.etl`文件可用Wireshark打开，筛选协议为`HTTP`或`TCP`，查看每个请求的源地址、目的地址及传输字节数。导出为CSV后，用Excel统计总带宽消耗。