Sprite de imagen
Una técnica que combina múltiples imágenes pequeñas en un solo archivo, usando CSS background-position para mostrar regiones específicas y reducir el número de solicitudes HTTP.
Los sprites de imagen combinan múltiples imágenes pequeñas (iconos, botones) en una sola imagen grande, usando CSS background-position para mostrar regiones específicas. Esta técnica fue ampliamente adoptada en la era HTTP/1.1 cuando reducir el número de solicitudes mejoraba significativamente el rendimiento.
Cargar 20 iconos individuales requiere 20 solicitudes HTTP, pero un solo sprite requiere solo una. Cada icono se muestra especificando coordenadas como background-position: -32px -64px;. Se requiere una gestión precisa de coordenadas a nivel de píxel, con herramientas de generación de sprites que producen automáticamente mapas de coordenadas.
La multiplexación de HTTP/2 ha reducido enormemente la sobrecarga de solicitudes concurrentes, disminuyendo la necesidad de sprites. La entrega moderna de iconos favorece SVG o fuentes de iconos, aunque las hojas de sprites de animación siguen siendo relevantes en el desarrollo de juegos y casos de uso específicos.