Network Information API 不提供精确带宽值，而是通过 navigator.connection.downlink 返回估算的下行有效吞吐量（单位 Mbps），需检测兼容性、仅限安全上下文、搭配 type 和 effectiveType 使用，并在不支持时降级处理。
Network Information API 本身不直接提供“带宽”数值（如 Mbps），而是通过 navigator.connection 暴露网络连接的**类型**（如 '4g'、'wifi'）和**有效带宽估计值**（downlink，单位是 Mbps），这个 downlink 值是浏览器基于历史连接表现估算的**当前下行有效吞吐量**，可作为带宽的近似参考。
检查 API 是否可用并读取 downlink
该 API 是实验性特性，需先判断支持性，并注意它返回的是估算值，非实时精确测量：
- 仅在安全上下文（HTTPS 或 localhost）中可用；
-
downlink返回数字（单位 Mbps），例如 10 表示约 10 Mbps 有效下行速率； - 部分浏览器（如 Safari）暂不支持，需降级处理。
基础用法示例：
if ('connection' in navigator && navigator.connection) {
const connection = navigator.connection;
console.log('网络类型:', connection.type); // 'wifi', '4g', 'ethernet' 等
console.log('估算下行带宽:', connection.downlink, 'Mbps'); // 如 3.5、50、0.5
console.log('有效带宽上限:', connection.downlinkMax, 'Mbps'); // 少数浏览器支持（如 Chrome）
}
监听网络变化动态更新
网络条件可能随时变化（如从 WiFi 切换到移动网络），可通过事件监听获取更新：
立即学习“Java免费学习笔记（深入）”；
- 监听
navigator.connection.onchange； - 注意：事件触发不保证
downlink一定变化，建议每次触发时重新读取； - 避免高频日志或计算，合理节流。
示例：
const connection = navigator.connection;
function logNetwork() {
console.log(`类型: ${connection.type}, 带宽: ${connection.downlink} Mbps`);
}
logNetwork();
connection.addEventListener('change', logNetwork);
实际使用注意事项
这个值更适合做粗粒度策略决策（如自适应视频清晰度、图片懒加载质量分级），而非精确测速：
-
downlink是浏览器内部估算，受系统网络栈、缓存、并发请求影响，不代表物理链路最大带宽； - 移动端常偏低（尤其弱信号时），桌面端在有线网络下更稳定；
- 若需精确带宽测量，应使用主动测速方案（如下载固定文件并计算速率）；
- 搭配
type和effectiveType（'slow-2g'/'2g'/'3g'/'4g'）一起判断更可靠。
兼容性与降级方案
不支持时可结合其他线索辅助判断：
- 检查
navigator.onLine判断是否联网； - 用
screen.width或 UA 字符串粗略区分移动/桌面； - 服务端通过 User-Agent 或客户端上报的 RTT/首屏时间辅助分类；
- 对关键功能（如高清视频）始终保留手动切换选项。
不复杂但容易忽略：它不是实时网速计，而是浏览器给你的一个实用经验型提示。
