firebug - 为什么 Firefox DevTools 与 Firebug 或 Chrome DevTools 中下载的 KB 不同?

标签 firebug google-chrome-devtools firefox-developer-tools

谁能解释一下,为什么在任何页面上调试时,我总是发现 Firefox DevTools、Firebug 和 Chrome DevTools 在传输文件大小方面存在很大差异?例如,在 Stack Overflow 的主页上,我看到:

  • Chrome 开发者工具:282 KB
  • Firebug :246 KB
  • Firefox 开发者工具:873 KB

  • 真相是什么?

    最佳答案

    与 Chrome DevTools 的 Network 面板和 Firebug 的 Net 面板相反,Firefox DevTools 的 Network 面板中的摘要显示 size of the contents after decompression .这意味着它显示文件的实际大小,而不是文件传输的字节数。
    背景:一些服务器在将响应内容发送到客户端之前使用类似 GZIP 的算法压缩响应内容。以节省网络带宽。客户端收到内容后将其解压缩。
    Firefox DevTools 不提供传输文件大小的摘要(从 Firefox 38.0.1 开始)。网络面板仅显示 解压 面板底部的文件大小:
    Summary of network requests within the Network panel
    因此我创建了一个 enhancement request to display the transferred size在摘要和性能分析中。
    虽然面板有一个 Transferred 列,列出了每个文件的传输大小:
    Transferred column within Firefox DevTools Network panel

    关于firebug - 为什么 Firefox DevTools 与 Firebug 或 Chrome DevTools 中下载的 KB 不同?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30298201/

    相关文章:

    google-chrome - 无法在 Chrome 开发者工具/Firebug 中调试 javascript 问题

    performance - 是什么导致了这个过多的 "Composite Layers"、 "Recalculate Style"和 "Update Layer Tree"循环?

    firefox - Mozilla Firefox 开发人员工具 - 什么是灰色的选择器?

    javascript - 需要从 Firefox 插件中删除特定的 cookie

    header - Firebug - 如何查看 "attachment"的请求/响应 header 或触发打开/保存对话框的其他响应?

    css - 如何更改带有 FireBug 扩展的 css 类的 FireBug 表示?

    javascript - Chrome 开发工具 : Drop into debugger without switching to Sources tab

    firefox - 如何使用 Firefox Web Developer 工具栏设置 cookie 的路径?

    html - 为什么我的页面样式在样式子部分的 HTML 选项卡下的 Firebug 中被删除

    css - 修复有问题的响应式 CSS Zen 子主题