可直接用 navigator.connection 获取网络类型（如 '4g'、'slow-2g'）和下行带宽（downlink），结合 effectiveType 与 downlink 阈值做资源调度，监听 change 事件动态调整，并辅以心跳检测提升准确性。
可以直接用 navigator.connection 获取估算的网络等级（如 '4g'、'slow-2g'）和下行带宽（downlink），再结合业务逻辑决定加载低清图、简化动画、跳过预加载等策略。它不提供精确网速，但足够支撑启发式资源调度。
识别有效网络类型（effectiveType）
effectiveType 是最常用、兼容性相对较好的字段，返回字符串如 'wifi'、'4g'、'3g'、'2g'、'slow-2g'。它综合了带宽与延迟，比单纯看 type（如 'cellular'）更贴近实际体验。
- 优先检查
'connection' in navigator，避免在不支持的浏览器（如 Safari 桌面版）中报错 -
'slow-2g'和'2g'建议禁用图片懒加载、关闭自动播放视频、用占位符替代高清头像 -
'wifi'或'4g'可启用 WebP/AVIF、预加载关键模块、加载完整图表库
用 downlink 辅助带宽分级决策
downlink 返回估算的下行速率（单位 Mbps），数值更连续，适合做阈值判断。例如：
-
downlink < 0.5：极弱网，只加载文本+SVG图标，推迟所有 fetch 请求 -
0.5 <= downlink < 2：弱网，加载压缩后的 JPG（质量 60%）、禁用字体子集外的字重 -
downlink >= 4：良好网络，可请求高清图、加载 Lottie 动画、启用客户端搜索索引
注意：该值是浏览器基于近期网络行为的平滑估算，非实时测量，不适合做秒级波动响应，但适合作为页面初始化时的资源策略开关。
监听 change 事件动态调整
用户切换 Wi-Fi 和蜂窝网络时，navigator.connection 会触发 change 事件，可用于运行时降级或升级资源：
- 监听后重新评估当前资源队列，比如把正在加载的 2MB 视频替换成 300KB 的低码流版本
- 配合
saveData: true，主动禁用非必要埋点、关闭图片长按保存、跳过 CDN 图片优化参数（如?w=800&f=webp） - 避免高频触发：事件可能连续发出，建议用防抖（如 500ms）包裹处理逻辑
补充心跳检测提升准确性
navigator.connection 无法反映真实服务可达性。例如连上了 Wi-Fi 但 DNS 失败，或企业内网能通局域网却无法访问 API。
- 在页面启动时发起一次轻量
fetch('/health?ts='+Date.now())，超时设为 3s - 结合
navigator.onLine与心跳结果：仅当两者都正常时，才认为“可用网络”成立 - 心跳失败时，可降级到本地缓存数据，并提示“网络暂时不稳定，部分内容已离线加载”
