Идея состоит в том, чтобы избежать ненужных HTTP-запросов. Это особенно важно, если у вас много маленьких значков (например, для WYSIWYG-редактора, подобного тому, который используется на этом сайте). Если у вас двадцать значков размером 16x16 пикселей, это не будет означать значительную пропускную способность, но это все равно будет означать двадцать дополнительных запросов при каждой загрузке страницы.
Другими кандидатами на спрайты являются состояния кнопок и все, что является чисто декоративным, но является частью макета.
Если вы используете изменения фонового изображения при переворачивании, вы также обнаружите, что вам придется либо предварительно загрузить изображение состояния переворачивания (либо с JS, либо с глупым жестким кодированием), либо вы столкнетесь с некоторой задержкой в качестве браузер запрашивает ранее неиспользуемое изображение. Спрайты могут облегчить это.
Вещи, которые вы, вероятно, не должны делать спрайтами, - это картинки, которые НЕ являются просто графическими элементами (например, графики, иллюстрации, аватары, реклама) или которые сильно изменятся (например, аватары или реклама).
Нельзя поменять спрайты, но в зависимости от того, сколько мыслей вы вложили в расположение листа спрайтов, это может быть очень сложно сделать. Ничто не заставляет вас делать спрайт-лист сверхконденсированным, но очевидно, что размер файла лучше, если в нем не так много лишних пробелов (см. Google).
Обратите внимание, что дополнительные запросы могут не быть проблемой для вас, если у вас сайт с относительно низким трафиком (который есть почти у всех, кроме Google или Amazon). Тем не менее, спрайты могут по-прежнему улучшать производительность для мобильных устройств, поскольку это означает меньшую вероятность ошибок и, следовательно, меньшую задержку.