哈尔滨市网站建设_网站建设公司_Ruby_seo优化

深圳大学前端测网速原理｜JS 网速测试实现思路源码分析

关键词：
前端测速原理、JavaScript 测网速、前端网速测试实现、校园网测速、JS 下载测速

一次偶然的测速页面，背后其实很“原始”

前两天我点开了深大校园网的测速页面，地址很简单，页面也非常“复古”。
但作为前端，我第一反应不是测速结果，而是：它到底是怎么测的？

当我查看源码后，发现这其实是一个非常经典、非常纯粹的前端测速方案，几乎不用任何库，甚至连 Ajax 都没用。

下面我们就从源码出发，一点点拆解。

一、整体思路先说结论

这个页面的测速逻辑，本质上只有一句话：

通过下载一张“已知大小”的图片，用下载耗时计算网速

但具体怎么做？我们继续往下看。

二、HTML 结构：测速其实藏在<img