网页重量
x-ray
粘贴你页面的 HTML，看清它加载了什么的骨架；每一个脚本、样式表、图片、字体和嵌入，重的会被标记，还有一份按优先级排序的修复清单。无需网络测试；一切都在你的浏览器里运行。
粘贴。扫描。减重。
诚实说明：没有网络测试，这个工具无法知道真实的传输大小；它统计的是 HTML 要求浏览器去获取的东西。那幅结构性的图景，正是大多数重量问题藏身之处。若要测量实际字节，之后请用浏览器 DevTools 的 Network 标签跑一遍同一页面。
估算成本表
| 资源 | 数量 | 请求 | 代价是什么 |
|---|
每一个外部资源
Yetty 把你的页面作为干净的静态 HTML 托管在全球 CDN 上，没有构建器运行时，没有一锅脚本汤，快是天生的。
让页面变重的
六样东西
脚本
外部与内联，以及内联代码的字节数。JavaScript 是网络上最昂贵的字节；它既要下载，又要运行。
样式表
每一张外部样式表在到达之前都会阻塞渲染。更少、更小，或内联关键 CSS，才是赢家。
图片
缺少 width/height 会造成布局偏移；缺少 loading="lazy" 会下载屏幕外还没人看到的图片。
字体
每一个字体族和字重都是一次下载，可能让文字闪烁或跳动。两个字体族通常绰绰有余。
嵌入
YouTube、地图和社交小组件是大石头；在有人交互之前，每个就是几百 KB。请使用点击加载的外观占位。
HTML 本身
内联脚本、样式和 base64 数据块会撑大文档；这是唯一无法延迟加载的资源。
网页重量，
简单说清
一个网页应该有多重？
如今网页的中位大小约为 2 MB，但快速的网站瞄准的要低得多；传输量低于 1 MB，请求数低于约 50 个。最伤害性能的不是某一个大数字，而是结构：几十个小脚本各自都要一个请求，而单个 YouTube 嵌入拉进来的 JavaScript，可能比你页面其余部分加起来还多。
YouTube 和地图嵌入真的会拖慢页面吗？
会的，它们通常是页面上最重的东西。一个默认的 YouTube 嵌入，在有人按下 Play 之前就要加载大约半兆字节的脚本，交互式地图也类似。标准的解决办法是外观占位（facade）：先显示一张静态缩略图，只有当访客点击时才加载真正的嵌入。
为什么图片需要 width 和 height 属性？
没有它们，浏览器就不知道一张图片会占多少空间，于是页面在图片加载时会跳动；这个跳动就是 Cumulative Layout Shift，Google 的 Core Web Vitals 之一。加上 width 和 height（或 CSS aspect-ratio）会提前预留空间，而 loading="lazy" 让屏幕外的图片在需要之前根本不加载。
更多免费工具： 完整的工具箱 · 图片 alt 文本审查器 · 重定向链可视化 · 托管 AI 搭建网站的最佳方式