程序员经验分享-hwhale

在 HTTP/2 中使用图像精灵有意义吗？

2023-12-24

JS 和 CSS 文件的捆绑在 HTTP/2 中不需要 https://stackoverflow.com/questions/30861591/why-bundle-optimizations-are-no-longer-a-concern-in-http-2，但是图像精灵呢？

看着the demo https://http2.akamai.com/demo看起来它的工作速度已经比 HTTP/1.1 快得多，但是将图像捆绑到精灵中不会使它更快吗？我的意思是，当所有数据都在一个文件中时，PNG 的优化算法不会工作得更好吗？


这取决于您的图像大小和格式。如果图像足够大，则使用精灵不会获得太多收益，但对于小图像，即使使用 HTTP/2，也会获得显着的收益。 HTTP/2 的优点在于标头开销大大减少，往返次数甚至更少（假设服务器实现 PUSH）。问题是，您的文件应该多小才能考虑捆绑它们？

对于位图，你说得很好，因为 PNG 的优化算法有利于精灵，特别是当它们的尺寸足够小时。例如，虽然图像在大小为 17.4 kb，对其进行切片会生成 132 个单独的图像，总计 135 kb。当您添加少量但仍然存在的额外传输开销时，它接近十倍。是的，当服务器和客户端之间的带宽有限时，大小仍然很重要。

其实这也达到了文本资源，如 javascript、css 和SVG 文件。如果它们足够小并且不经常更改，您仍然可以考虑将它们捆绑在一起。例如，JavaScript 中ng文件夹 https://github.com/angular/angular.js/tree/master/src/ng如果作为单独、缩小和压缩的 js 进行传输，Angular 的源代码需要 69.6 kb。如果在 gzip 压缩之前将它们连接起来，则只有 31.9 kb。然而，这里的系数略高于 2，如果 HTTP/2 节省了连接时间和往返时间，那么它可能就不那么重要了。这进一步平衡了单独缓存资源的可能性。

最后一点，如果您的小图像/图标是 SVG 矢量（它们应该！），那么它们将被视为文本资源。此外，SVG 矢量往往会更大一些，例如，Firefox 的 SVG 图标 http://svgicons.o7a.net/official/firefox.svggzip 压缩后大小为 15.7 kb。在这种规模下，如果 HTTP/2 的功能有效的话，那么决定链接到它、内联还是捆绑是显而易见的。

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

http

PNG

jpeg

Http2

imageoptimization

在 HTTP/2 中使用图像精灵有意义吗？ 的相关文章

  • 当服务器仅从请求中读取标头时，Http 客户端未收到响应

    我在 Java 中搞乱了 HTTP 和套接字 希望你能对此有所了解 当我用 Java SE 11 编写的 HTTP 服务器没有读取整个请求然后响应时 客户端不会收到它或收到错误 这是为什么 在服务器读取整个请求之前 客户端是否无法读取响应

  • Perl：读取网页文本文件并“打开”它

    我正在尝试创建一个脚本来读取文本文件 然后分析它们 无论文本文件是在线还是离线 离线部分完成 使用 open FILENAME anyfilename txt analyze file sub analyze file while

  • 获取 png 图像的像素的 alpha 值？

    我正在使用以下代码 img imagecreatefrompng image png col imagecolorat img x y alpha col gt gt 24 0x7F 但 alpha 值始终为 127 即使像素位于 x y

  • 在 C# 中的 RESTfull/HTTP 请求中添加标头和发布数据

    我在 C 中发送 POST 请求时遇到问题 似乎我误解了一些 HTTP 基础知识 所以基本上我正在实施 RESTfull 服务client 其工作原理如下 使用用户名 密码发出 POST 请求并获取令牌 在发出其他 GET POST PUT

  • Vagrant 的端口转发不起作用[关闭]

    Closed 这个问题是无关 help closed questions 目前不接受答案 我在最后遇到了一个小问题入门指南vagrant http vagrantup com docs getting started ports html

  • 从 PNG 图像中提取元数据

    我正在尝试从 PNG 图像格式中提取元数据 我正在使用这个库 http code google com p metadata extractor http code google com p metadata extractor 尽管它声称

  • 如何在我的 gstreamer 中启用 httpsrc 插件？

    我尝试使用以下命令播放通过 http 检索的 mp3 文件或流 gst launch httpsrc location http domain com music mp3 mad osssink 但出现以下错误 ERREUR le pipe

  • 检查 Javascript 中的 URL 是否损坏

    这个问题之前已经发布在 Stack 上 但没有一个具体到我想要理解的内容 检查 URL 是否正确的最简单方法是发送 http Head 请求 但是如何使用它来指定 URL 呢 我在之前的帖子中发现了这一点 function UrlExist

  • ResponseNotReady 对于真正简单的 python http 请求？

    我正在用 python 编写一个简单的脚本重放保存的 HTTP 请求 https stackoverflow com questions 8384848 method program for sending a given http req

  • 无法更改 php 会话 cookie 名称

    我将现有且成功运行的站点复制到新的开发服务器 新服务器上的登录现在已损坏 我追踪到虽然会话 cookie 已重命名 ini set session name DOMAIN1 浏览器继续将会话 cookie 存储为 PHPSESSID 当我从

  • C# HttpWebRequest 服务器未返回完整响应

    我正在向返回带有数据的 HTML 的服务器发出 HTTP 请求 但有时它会 停在中间 没有任何明确的解释 例如响应结束 Content length 14336 chars p p br ul ul example com var auth

  • 适用于 .NET 的最快 PNG 解码器

    我们的网络服务器需要先处理许多大图像的组合 然后再将结果发送到网络客户端 此过程对性能至关重要 因为服务器每小时可以接收数千个请求 现在 我们的解决方案从 HD 加载 PNG 文件 每个大约 1MB 并将它们发送到显卡 以便在 GPU 上完

  • 在 Rest 中使用 POST 进行删除/更新？

    我明白 从接受的答案HTTP 和 REST 有什么区别 https stackoverflow com questions 2190836 what is the difference between http and rest that

  • 将对象数组作为请求中的 url 参数传递

    我需要将一个对象数组 每个对象有 2 个字段 作为 http 请求的 url 中的参数 我该怎么做以及这个链接应该是什么样子 您可以使用您的结构创建一个 xml 即一个对象数组 每个对象都有两个字段 然后将其转换为字符串 如下所示 举个例子

  • 如何使用 c 使用 libpng 更改 png 图像的 RGB 值？

    更改 png 图像的 rgb 值的推荐方法是什么 现在我正在使用示例代码来查看 libpng 的工作方式 它只打开一个 png 图像并写入另一个 png 图像 但是我想更改这个新图像的 RGB 值 使其变为全蓝色 绿色或红色 无论我选择什么

  • 摆脱浏览器控制台中的 401（未经授权）ajax 错误

    我正在使用 javascript 通过 api 调用jQuery ajax http api jquery com jQuery ajax 称呼 如果用户未经过身份验证 API 会响应 401 并且我只想针对此调用忽略此错误 我已经尝试了

  • matplotlib 绘图，然后等待原始输入

    我正在尝试打开一系列 png 图 我希望能够在屏幕上查看绘图 然后收到提示 等待我 按 Enter 按回车键后 应显示下一个图 我见过很多类似的问题 Matplotlib 强制绘图显示然后返回主代码 https stackoverflow

  • 使用 HTML 表单时如何在 HTTP 请求正文中发送数据？

    HTTP 规范规定 POST 请求可以包含任意数据体 An HTML form元素可以 POST 到 URL 并且可能包含input元素 但那些input元素变成查询字符串 我怎样才能得到一个form还可以在按下提交按钮时发送的 HTTP

  • 如何让 NSURLRequest 获取 Twitter 请求令牌？

    我正在尝试使用以下代码从 Twitter 获取请求令牌 NSMutableURLRequest mURLRequest NSMutableURLRequest alloc initWithURL NSURL URLWithString ht

  • AWS ALB 截断 HTTP 响应

    我有一个带有目标组的 ALB 和运行 PHP API 的 ECS 集群 我正在尝试查询 API 以获得 CSV 响应 但如果请求通过 ALB 我会得到被截断的结果 当我通过 SSH 连接到运行集群的 EC2 实例并尝试手动运行curl 通过

随机推荐

热门标签