图像精灵

图像精灵将多个小图像（图标、按钮）合并为一张大图，使用 CSS background-position 显示特定区域。这项技术在 HTTP/1.1 时代被广泛采用，因为减少请求数量能显著提升性能。

加载 20 个单独的图标需要 20 次 HTTP 请求，而单个精灵图只需一次。每个图标通过指定坐标来显示，如 background-position: -32px -64px;。需要精确的像素级坐标管理，精灵图生成工具会自动输出坐标映射。

HTTP/2 多路复用大大降低了并发请求开销，减少了对精灵图的需求。现代图标交付倾向于使用 SVG 或图标字体，不过动画精灵表在游戏开发和特定场景中仍然适用。