最近一段时间在使用Chrome浏览器的过程中,遇到了一个很无奈的现象:经常死机。每次工作忙,精神不集中的时候,Chrome突然就死机了。这让我不得不关闭浏览器,重新启动它,然后重新打开之前的所有选项卡,这是一种非常糟糕的体验。由于之前比较忙,没有纠结这些细节,所以这两天特意研究了一下是什么原因导致Chrome崩溃的。话不多说,给大家介绍一下,以免大家踩到同一个陷阱!Chrome本身自然非常占用内存,但导致Chrome变慢的最大罪魁祸首是扩展程序。应该有很多同学和我一样,因为各种原因在浏览器上安装了很多功能各异的扩展。正是因为这些扩展,Chrome变得异常臃肿,消耗了大量的CPU资源。为了确定扩展程序对Chrome的影响,我们调查了1,000个最流行的Chrome扩展程序在不同网站上的性能,比较了它们如何影响浏览器性能和最终用户体验。在这些扩展中,有非常知名的插件,例如Evernote、LastPass和DarkReader。增加网站的CPU使用率虽然一些良好的扩展程序只在必要时运行代码,但仍有许多Chrome扩展程序在您打开的每个页面上运行额外的代码。在100个最受欢迎的Chrome扩展程序中,Evernote对性能的负面影响最大。它会花费368毫秒在您打开的每个页面上运行代码。如果您在此期间尝试与该页面进行交互,它会感觉迟钝。这些浏览器扩展中的每一个都已安装超过一百万次。虽然几百毫秒听起来并不多,但如果安装了多个扩展程序,它会对用户体验产生很大影响。浏览器扩展的速度影响取决于用户打开的网站,以上结果是在一个非常简单的网站上收集的。在测试Apple主页上的扩展程序时,我们可以看到一个名为DarkReader的扩展程序花费了25秒来分析和调整图像以更好地适应黑暗主题。因此,页面加载速度要慢得多。优惠券代码查找工具Honey也显着影响了电子商务网站的网站速度,增加了825毫秒的CPU处理时间。最后,在丰田主页上进行测试时,我们可以看到NortonPassword增加了CPU活动最多,增加了大约1秒的CPU时间。该图仅显示了对性能影响最大的5个扩展,即使没有安装任何扩展,toyota.com也使用了超过3秒的CPU时间,因此很难将随机更改的影响与扩展分开。排名前1000的扩展让我们来看看其他一些不太受欢迎但安装量仍超过100,000的扩展。Ubersuggest是一款拥有超过200,000名用户的营销工具,它为每个页面增加1.6秒的CPU活动。替换是一个Chrome扩展程序,可以自动替换页面上的某些单词。在小型网站上,它对性能几乎没有影响(增加CPU时间约10毫秒),但在像toyota.com这样的大页面上,它增加了9.7秒的CPU活动。影响页面呈现时间的CPU活动会导致页面挂起、变得无响应并增加电池消耗。但是,如果处理发生在初始页面加载之后,对用户体验的影响可能不会那么大。一些扩展,如Loom和Ghostery,运行大量代码而不影响页面开始呈现所需的时间。但是,Clever、Lastpass和DuckDuckGoPrivacyEssentials等其他扩展程序会在页面开始加载时运行代码,从而延迟用户首次能够查看页面内容的时间。该图表使用FirstContentfulPaint指标来衡量这一点。虽然Apple的主页通常在不到一秒的时间内呈现,但安装了DarkReader却花了将近四秒钟。在一个电子商务网站上,Honey还将页面内容的出现延迟了将近半秒。AviraBrowserSecurity和一些广告拦截器也可以延迟页面内容开始出现的时间。排名前1,000的扩展查看1,000个最流行的扩展表明,名为OutreachEverywhere的新媒体工具将渲染延迟了342毫秒,而名为OutreachEverywhere的销售工具则增加了251毫秒。在加载丰田主页时,一个名为anonymoX的匿名浏览代理延迟了2秒以上的渲染——然而,这并不奇怪,因为流量是通过另一台服务器路由的。AviraBrowserSafety将渲染延迟了369毫秒。这不是由于正在访问的页面上运行的代码,而是由于扩展程序执行的后台工作。后台CPU使用情况Chrome扩展程序不仅可以在您访问的页面上运行代码,还可以在属于Chrome扩展程序的后台页面上运行代码。例如,此代码可能包含阻止对某些域的请求的逻辑。即使在访问一个简单的页面时,AviraSafeShopping也会让CPU工作超过2秒。在更复杂的页面上,DashlanePasswordManager和AdGuardAdBlocker的后台活动也需要超过2秒的时间。前1000个扩展三个扩展在查看新闻文章时导致CPU活动超过20秒:uberAgent、Dashlane和Wappalyzer。浏览器内存消耗Chrome扩展程序会增加每个访问页面的内存使用量,以及扩展程序本身的内存消耗量。这会损害性能,尤其是在低规格设备上。广告拦截器和隐私工具通常会存储有关大量网站的信息,并且需要大量内存来存储这些数据。也就是说,当在浏览器中打开许多广告密集的网页时,它们还可以减少整体内存消耗。排名前1000的扩展当查看排名前1000的扩展时,广告拦截器继续消耗大量内存,Trustnav广告拦截器增加了近300MB的内存消耗。广告拦截器和隐私工具虽然广告拦截器对无广告网站施加了额外的处理和负担,但它们确实可以大大加快广告繁多的网页的速度。本节检查安装量超过500,000的15个广告拦截器。加载跟踪器和呈现广告通常是CPU密集型的,尽管具体影响因站点而异。新闻网站往往是广告密集型网站,因此本报告将检查两篇新闻文章的CPU使用情况:在没有广告拦截器的情况下,每页CPU时间为17.5秒。即使是性能最低的拦截器(通过Trustnav)也将其减少57%至7.4秒。Ghostery是本次测试中表现最好的广告拦截器,将CPU活动减少了90%,平均仅为1.7秒。\uBlockOrigin的作者RaymondHill指出,虽然所有扩展都减少了页面上的CPU活动,但有些扩展还在后台页面中引入了显着的CPU活动,抵消了一些节省。在后台进行的工作不太可能影响网页本身的性能,但它仍然会降低计算机的整体速度。广告拦截器和隐私工具也可以减少43%到66%的数据量。在没有广告拦截器的情况下,每篇文章平均发出793个网络请求。使用Ghostery,这个数字下降了90%,仅为83。在没有安装广告拦截器的情况下,打开一篇新闻文章的平均浏览器总内存消耗为574MB。关闭它后,该数字减少了54%,仅为260MB。但是,由于浏览器扩展总是需要一些内存才能运行,因此其他广告拦截器(例如来自Trustnav的广告拦截器)会略微增加内存消耗。在这种情况下,屏蔽广告所节省的费用并没有超过广告拦截器的额外成本。但是,请记住,这仅适用于打开一个广告密集的页面的情况。如果您打开10个选项卡,全部显示新闻文章,那么您将看到10倍的内存节省,但一般来说,广告拦截器的内存消耗不会线性增加。安装扩展的影响?在大多数情况下,多个Chrome扩展的影响会叠加。此屏幕截图显示了apple.com的ChromeDevTools页面的性能配置文件,其中安装了四个扩展(axeWebAccessibilityTesting、EvernoteWebClipper、LastPass和Skype)。如您所见,CPU任务一个接一个地运行。如果扩展程序配置为在页面开始加载时立即运行,这会延迟页面的初始呈现。扩展优化性能我查看了今年测试和去年测试中包含的96个最流行的扩展。取所有变化的平均值显示页面上的CPU时间减少了28毫秒。但是,2021年的测试是使用Chrome91运行的,而2020年的测试是使用Chrome83运行的。随着Chrome浏览器随着时间的推移变得越来越快,这些改进可能并不一定意味着Chrome扩展程序本身已经得到优化。当使用旧版Chrome运行今年的测试时,平均改进仅为13毫秒。请注意,此比较仅查看一个网站(简单测试页面)的一个指标。Grammarly、MicrosoftOffice、OktaBrowserPlugin、AviraSafeShopping和AviraBrowserSafety均显示页面CPU时间减少超过100毫秒。削减幅度最大的是SavetoPocket、Loom和Evernote。下面针对个别典型扩展一一探讨。去年,Grammarly在每个页面上加载了一个1.3MB的Grammarly.js文件。现在,在大多数网站上,只加载了112KB的Grammarly-check.js脚本。例如,只有当用户关注文本区域时,扩展才会加载完整的Grammarly.js文件。但是,某些站点仍然总是加载全部脚本。例如,LinkedIn、Medium、Slack、Reddit、Upwork、Zendesk和其他经常输入文本的网站。在这些站点上,性能影响将比这些测试中显示的更大。Evernote每页加载4.3MB的内容脚本,高于一年前的2.9MB。因此,解析、编译和运行这段代码需要花费大量时间。OutreachEverywhere每页加载4.5MB的代码。但是,这段代码对性能的影响要大得多,因为它是在document_start而不是document_idle上加载的。这意味着代码在被访问的页面开始呈现之前运行,延迟时间直到显示页面内容。此图显示了安装了这两个扩展的ChromeDevTools性能配置文件。本文仅选取部分具有代表性的插件进行分析,无法一一列举。
