广告脚本必须用async而非defer或内联，因其无需DOM就绪即可初始化上报；应置于body靠前位置、预连接第三方域名、手动懒加载、设容器宽高防CLS、配纯CSS fallback，并禁用首屏广告懒加载。
广告脚本是页面首屏白屏和交互延迟的高频元凶——不是因为它“不能加”，而是它常被无条件同步加载、缺乏降级兜底、且与业务逻辑争抢资源。直接放 <script src="ad.js"></script> 到 <head> 里，等于主动给用户发一张“请等待”的罚单。
广告脚本为什么必须用 async，而不是 defer 或内联
广告 SDK（如 Google Ad Manager、腾讯广点通）通常不依赖 DOM 结构，也不需要按顺序执行；它们只关心尽快初始化并上报曝光。用 defer 反而会拖慢：它强制等到 DOM 解析完成才执行，但广告本身并不需要 DOM 就绪；而内联或同步加载则彻底阻塞 HTML 解析，首屏内容直接消失。
-
async是唯一合理选择：下载不阻塞，执行时机不可控但符合广告逻辑（早执行 ≠ 错执行） - 禁用
document.write()—— 所有现代广告平台已弃用该方式，强行保留会导致整个文档流被清空 - 避免在
<head>中写<script async src="ad.js"></script>：虽然不阻塞解析，但会抢占关键资源带宽（比如 CSS、字体），应挪到<body>靠前位置，略晚于首屏 DOM，早于主业务 JS
第三方广告域必须 preconnect，否则 DNS+TCP 延迟吃掉 200ms+
广告资源大多来自独立子域（如 securepubads.g.doubleclick.net），浏览器首次请求前需完成 DNS 查询、TCP 握手、TLS 协商。若没提前声明，这些耗时全挤在广告脚本触发时刻，直接拉长 LCP。
- 在
<head>中加：<link rel="preconnect" href="https://securepubads.g.doubleclick.net" crossorigin> -
crossorigin属性不能省：广告 JS 常含跨域 fetch 或 image beacon，缺它会导致预连接失效 - 验证是否生效：Chrome DevTools → Network → 查看该域名请求的 “Connection” 时间是否接近 0ms；若仍显示 DNS Lookup/TLS，说明 preconnect 未命中或协议/子域不一致
懒加载广告位要手动控制，loading="lazy" 对 iframe 广告无效
原生 loading="lazy" 只对 <img> 和 <iframe> 生效，但多数广告是通过 JS 注入 <iframe> 或动态 script，浏览器根本无法识别其“懒加载意图”。更麻烦的是：Safari 15.4 之前完全忽略 <iframe loading="lazy">，旧版安卓 WebView 更是直接无视。
使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。
立即学习“前端免费学习笔记（深入）”；
- 正确做法：用
IntersectionObserver监听广告容器进入视口后，再调用广告 SDK 的refresh()或display()方法 - 必须设置容器
width和height：否则广告 iframe 加载时引发布局偏移（CLS），Core Web Vitals 直接扣分 - 首屏广告位（如顶部 banner、文章内第一帧）禁用懒加载：它们本就是 LCP 候选元素，延迟加载等于主动放弃性能指标
广告失败必须有 fallback，且 fallback 不能触发额外网络请求
广告加载失败率在弱网或拦截器环境下常超 30%。若不做处理，空白广告位会撑开布局、影响滚动体验，甚至导致后续 JS 报错（比如监听了不存在的广告容器尺寸）。
- fallback 应为纯 CSS 占位：例如一个带背景色和文字提示的
<div class="ad-placeholder">广告位</div>，不引入新资源 - 禁止 fallback 写
<img src="fallback-ad.jpg">：这又是一次 HTTP 请求，失败时再失败，形成雪崩 - SDK 初始化失败时，显式调用
window.googletag.pubads().disableInitialLoad()（GPT）或对应平台的 disable 方法，防止重试逻辑持续占用主线程
最易被忽略的一点：广告脚本的错误边界极窄——它既不能等 DOM，也不能干扰渲染，还常被用户脚本拦截器干掉。所以所有加载逻辑必须默认按“可能失败”设计，而不是靠 try/catch 补救。真正的优化不在压缩广告 JS 多少 KB，而在让它从始至终不成为页面性能的单点故障。
