第三方 JavaScript 性能

了解第三方 JavaScript 对性能的影响,以及您可以采取哪些措施来防止其拖慢网站速度。

Milica Mihajlija
Milica Mihajlija

第三方 JavaScript 通常是指您的网站中嵌入的具有以下特征的脚本:

  • 非您创作
  • 由第三方服务器投放

网站会将这些脚本用于各种目的,包括:

  • 社交分享按钮
  • 视频播放器嵌入
  • 聊天服务
  • 广告 iframe
  • 分析和指标脚本
  • 用于实验的 A/B 测试脚本
  • 辅助库(如日期格式设置、动画和功能库)

第三方脚本可以提供强大的功能,但这还远远不够。它们还会影响隐私、安全性和页面行为,并且尤其会给性能带来问题。

性能

如果存在大量的 JavaScript,就会降低性能。但是,由于第三方 JavaScript 通常不在您的控制范围之内,因此可能会带来其他问题。

网络

设置连接需要时间,而向多个服务器发送过多请求会导致速度下降。对于安全连接而言,这一时间会更长,因为安全连接可能会涉及 DNS 查找、重定向以及到处理用户请求的最终服务器多次往返。

第三方脚本往往会增加网络开销,例如:

  • 触发其他网络请求
  • 拉取未经优化的图片和视频
  • HTTP 缓存不足,这会强制频繁提取网络资源
  • 资源的服务器压缩不足
  • 由不同第三方嵌入提取的框架和库的多个实例

渲染

第三方 JavaScript 的加载方式非常重要。如果是在关键渲染路径中同步完成,则会延迟对文档其余部分的解析。

如果第三方出现服务器问题且未能投放资源,系统就会阻止呈现,直到请求超时(时长介于 10 到 80 秒之间)。您可以使用 WebPageTest 单点故障测试来测试和模拟此问题。

解决办法

通常不可避免地要使用第三方 JavaScript,但您可以采取以下措施来最大限度地减少负面影响:

  • 在选择第三方资源时,请青睐发送最少代码量且仍能为您提供所需功能的资源。
  • 为第三方内容使用效果预算,以控制其费用。
  • 不要使用两家不同供应商的相同功能。您可能不需要两个跟踪代码管理器或两个分析平台。
  • 定期审核并清理多余的第三方脚本。

如需了解如何审核第三方内容并高效加载内容,从而获得更好的性能和用户体验,请参阅优化您的第三方资源部分的其他帖子。