通过 Lighthouse 的发布商广告审核提高站点速度

已发表: 2020-06-05
通过 Lighthouse 的发布商广告审核提高站点速度

这篇文章最近更新于 2021 年 9 月 6 日

发布商关于页面加载速度和网站一般行为的请求有所增加。 在今天的帖子中,我们将了解发布商提出的一些问题,稍后我们将向您展示如何制作自己的报告,并更好地评估您的页面加载情况。

#1 – 网站加载缓慢,报告工具得分低

了解网站的最终行为是多种因素的结果很重要:用于构建页面的技术、网站上显示的元素数量、这些元素的存储方式、运行时的计算等。报告工具(例如我们稍后将讨论的 LightHouse)将查明这些问题。 请注意,这些问题与我们的代码无关,因为它们是网站构建方式的结果。

#2 – MonetizeMore 的代码使网站变慢

页面上的广告单元数量越多,需要加载的元素就越多,因此始终需要权衡页面速度和收入之间的关系。 发布商需要始终意识到这一点。 我们的代码不会对网站性能产生重大影响。MonetizeMore 广告脚本异步运行,这意味着,在标题竞价过程运行时,网站的其余部分将继续加载,就像没有我们的代码时一样。运行标头出价时,广告加载脚本不可避免地会延迟广告呈现,直到达到出价超时为止,这是另一个需要解决的权衡问题。 默认建议超时为 2000 毫秒,以便在页面加载速度和良好的标头出价填充率之间取得健康的平衡。 降低此超时可能有助于减少加载时间,前提是页面加载速度快于设置的超时。 降低标头出价超时时间会增加标头出价拍卖可能在所有已配置的投标人返回其最终出价之前结束的机会。

灯塔

我们将在未来使用 Lighthouse 的发布商广告审核,您可以在这里找到它:https://developers.google.com/publisher-ads-audits

尽管我们的脚本可能不是页面性能的罪魁祸首,但页面性能确实会影响流量,因此它成为我们的一个重要问题。 对站点进行自己的评估,并尝试解决建议/警告。

使用 Chrome:

1.- 打开目标网页

2.- 右键单击​​并选择检查

右键单击并选择检查

3.- 在开发工具中,寻找最后一个,称为 Audits

Lighthouse 的广告审核

4.- 选择相关类别并单击“生成报告”。 多次刷新站点后,将生成并显示报告。

灯塔截图

您将看到评估页面的几个类别:

  • 性能:页面的技术执行,包括交互性、速度和编码。
  • 可访问性:设计元素让有特定障碍的人更舒适地参与内容
  • 最佳实践:一般性建议,主要用于改善导航和安全性
  • SEO:优化搜索引擎以与网站互动
  • 渐进式 Web 应用程序:PWA 是一种特定类型的网站,无论是在外观上还是在幕后,它都非常类似于移动应用程序。 下面是针对此类网站的优化建议。

这些信息中的大部分都非常简单。 我们应该密切关注的一个是 performance -> Diagnostics,我们可以在其中查看 js 代码的性能,尤其是我们的代码。

诊断

在上图中(诊断 -> 减少第三方代码的影响),我们看到我们的代码在主线程(负责加载页面的线程)中阻塞了不到三分之一秒。 这些代码都不会大量阻塞主线程,但整组第三方代码使用了主线程的整整一秒,这最终是用户体验。

javascript 执行时间

在上图中(诊断 -> 减少 JavaScript 执行时间),我们看到我们的代码在执行时间上与其余代码一致。 即使执行时间更长,这是在另一个线程中异步完成的,因此不会影响性能。

注意事项

  • 您可以执行一个简单的测试,通过在没有我们的标签的情况下运行此报告,然后添加我们的标签并再次运行该报告。 如前所述,权衡会使总分下降,但这是预料之中的。
  • 大多数页面速度测试/分数都没有考虑运行标题竞价时所需的延迟,并且旨在评估硬编码的广告标签。 因此,当在页眉出价处于活动状态的页面上运行时,他们不会考虑自定义功能并降低它的分数。
  • 您自己的 Chrome 插件可能会严重改变报告本身的性能。 您可以尝试在更干净的环境中测试页面:
    • 转到以下页面:https://developers.google.com/publisher-ads-audits。
    • 粘贴网站地址
    • 在 Advanced Settings 上,激活 Run Additional Lighthouse Audits。
    • 单击生成报告
    • *此报告还将为您提供发布商广告报告。 如果站点配置正确,则得分应该很高,因此它是向发布商表明任何性能问题可能出在别处的好方法
  • 如果必须提高性能,您可以考虑:
    • 减少页面上的广告单元数量
    • 根据其他重 JS/资源调用的实现,将 MonetizeMore 脚本调用移动到页面末尾或更高位置
    • 将标头出价超时减少到传入出价没有明显损失的值(可以通过 PGAI 进行测试:在出价人选项卡下,对收到的出价进行颜色编码)
    • 延迟加载所有页面上的所有广告位置。 (在 dbAdmin 中启用 SPA 并将 DIV 切换为惰性格式)

其他更多技术建议可以是:

  • 改善 JavaScript 负载:单次调用繁重的脚本或多次调用小型脚本会对性能产生负面影响。 在 JS 中的任务和调用之间取得平衡。 这只能通过发布者可以操作的 JS 文件来完成(例如,不是我们的包装器、GA 或 facebook 脚本)
  • 确保任何可以异步运行的脚本都这样做。 我们的脚本已经做到了
  • 确保资源(图像、视频)使用最新技术进行编码。 这允许元素在移动时被压缩,并在页面加载时解压缩。

需要更多帮助? 立即在 MonetizeMore 注册专业帐户!