他们渲染了一百万个网页，来了解网络如何崩溃

最近在 medium 上看到这篇“比较新鲜的”文章 《We rendered a million web pages to learn how the web breaks》 觉着不错（老外确实敢想敢做），遂翻译分享，以期拓宽视野、引人思考。本瓜不会去逐字翻译，旦求一个表意流畅。其间也会或加入自己的看法，或引用其它。总之网页找不到了错误信息连接失败，事儿就是这么个事儿，希望您喜欢~

为什么要渲染一百万个页面？

简单来说网页找不到了错误信息连接失败，就是现如今出现一种争议（argument）：网络从某种程度上来说比 15 年前更慢了。原因是日益繁荣的 JS 框架、网络字体、以及各类 polyfills 的增长，它们并没有使得我们从更高速的计算器、更快速的网络通信、更完备的网络协议中获益更多，甚至带来了损害。

So the argument goes.于是乎，作者团队想证明这种说法是否是成立的，并尝试找出导致 2020 年网站缓慢和崩溃的常见因素。

如何实现这一计划？

作者团队使用 Puppeteer 编写了一个 Web 浏览器（Chrome）脚本，启动 200 个 EC2 实例，让它在周末运行，渲染排名前一百万域名的根页面。

从这么几个统计指标看，这真是有够疯狂的。

在这个计划中，他们跟踪所有的 window.onerror 所捕获的错。

通常来说，我们都会跟踪客户反馈的错误，但是这一次，跟踪的却是整个网络的错误！这次将有足够的说服力：研究网页到底是如何在实际运行中崩溃的？

最常见的错误

分析数据表明，大多数问题都可以被归类。而这，就能为开发人员指引 Web 技术的未来发展方向：修复这一些小问题就可以将 Web 的报错数量减少十倍。

这些坏家伙的 TOP10 分别是：

引用错误

类型错误

语法错误

Error

调用异常

OneSignal

超出范围

Integration Error

chunk 下载错误

eval 计算错误

如 Tolstoy 所说：工作中的网址皆不相同，但是破坏它们的方式却是一致的。如您所见，这些网络错误的分布符合【齐夫定律】。此例中，有三种错误占了所有错误的极大比例。即：

引用错误（ReferenceError）、类型错误（TypeError）、语法错误（SyntaxError） 占所有错误的 85%！

显然，造成这些错误的方式有很多种，错误消息中的特定字符串会告诉我们具体发生了什么。作为开发者，我们一定常常遇到这其中的一些，并总是对它们感到熟悉。（这个错误我见过~）

当然，有很多方法可以产生这些错误类型。错误消息中的特定字符串告诉我们更多有关实际发生的情况的信息。查看最常见的错误消息会给您一定的熟悉感。作为网络开发人员，您之前可能已经遇到过其中一些。

让我们来看下具体的错误 TOP10 又是哪些？

找不到 $ 符（JQ 经典常见）

找不到 qq_qun（？）

jQuery 未定义（常见）

意外的符号 '