PerformanceResourceTiming：encodedBodySize 属性

基线 2023

新可用

自 2023 年 3 月起，此功能在最新的设备和浏览器版本中有效。此功能可能在旧设备或浏览器中无法正常工作。

encodedBodySize 只读属性表示从获取（HTTP 或缓存）有效负载主体中接收的大小（以字节为单位），在移除任何应用的内容编码（如 gzip 或 Brotli）之前。如果资源是从应用程序缓存或本地资源中检索的，则必须在移除任何应用的内容编码之前返回有效负载主体的大小。

值

encodedBodySize 属性可以具有以下值

表示从获取（HTTP 或缓存）中接收的大小（以字节为单位），在移除任何应用的内容编码之前，有效负载主体的大小。
如果资源是跨域请求，并且没有使用 Timing-Allow-Origin HTTP 响应标头，则为 0。

示例

检查内容是否已压缩

如果 encodedBodySize 和 decodedBodySize 属性不为空并且不同，则内容已压缩（例如，gzip 或 Brotli）。

使用 PerformanceObserver 的示例，当浏览器性能时间轴中记录了新的 resource 性能条目时，它会通知这些条目。使用 buffered 选项可以访问观察者创建之前的条目。

const observer = new PerformanceObserver((list) => {
  list.getEntries().forEach((entry) => {
    const uncompressed =
      entry.decodedBodySize && entry.decodedBodySize === entry.encodedBodySize;
    if (uncompressed) {
      console.log(`${entry.name} was not compressed!`);
    }
  });
});

observer.observe({ type: "resource", buffered: true });

使用 Performance.getEntriesByType() 的示例，它只显示在您调用此方法时浏览器性能时间轴中存在的 resource 性能条目

const resources = performance.getEntriesByType("resource");
resources.forEach((entry) => {
  const uncompressed =
    entry.decodedBodySize && entry.decodedBodySize === entry.encodedBodySize;
  if (uncompressed) {
    console.log(`${entry.name} was not compressed!`);
  }
});

跨域内容大小信息

如果 encodedBodySize 属性的值为 0，则资源可能是跨域请求。要公开跨域内容大小信息，需要设置 Timing-Allow-Origin HTTP 响应标头。

例如，要允许 https://mdn.org.cn 查看内容大小，跨域资源应发送

http

Timing-Allow-Origin: https://mdn.org.cn

规范

规范
资源计时 # dom-performanceresourcetiming-encodedbodysize

浏览器兼容性

BCD 表格仅在浏览器中加载

另请参阅

Timing-Allow-Origin