2013-05-02 2 views
1

Я знаю, что вы можете уменьшить время загрузки страницы, используя CSS-спрайт. Поскольку это уменьшит круглое путешествие и т. Д.Насколько CSS спрайт уменьшает время загрузки страницы?

Является ли их любое числовое значение или тест производительности, используя CSS-спрайт, сколько среднего времени загрузки страницы вы можете сохранить. Я знаю, что это будет зависеть от сайта. Мне интересно узнать об общих данных для сайта электронной коммерции, например, Amazon.com

Кроме того, если вы используете асинхронную загрузку изображений, например JAIL, сколько времени вы могли бы сэкономить. Я знаю, что вы не можете загружать все асинхронно.

+1

Это будет зависеть от количества изображений претворяется в спрайт и как быстро ваш сервер обрабатывает ruquests. –

+0

Определенно, но мне было интересно, есть ли общий эксперимент, чтобы оценить выгоду. – KhanSharp

+1

Простой: время загрузки страницы с спрайтами и без спрайтов. Это лучший способ рассказать. Инструмент Google также является полезным инструментом. –

ответ

1

Имея большой спрайт, по сравнению с небольшим изображением, большой спрайт не намного больше размера файла, чем небольшое изображение, предполагая, что вы рисуете изображения в спрайте по горизонтали, как и предполагалось.

Большинство браузеров будут делать около 6 одновременных загрузок сразу. Таким образом, общее эмпирическое правило состоит в том, что если у вас более 6 значков или графических объектов, его следует использовать. Если у вас есть фотографии или иллюстрации, их не следует пить.

+0

Чтобы расширить это, семантически это имеет смысл для фотографий и таких, чтобы быть '' изображениями, тогда как значки, естественно, являются большей частью стиля CSS (как спрайты) – babonk

1

Неправильное использование спрайтов приведет к перегрузке сервера. Спрайты используются для уменьшения количества запросов сервера, но большие srpites формата jpg могут быть плохими.

Это походит на баланс либо все меньшие изображения меньшего размера или спрайт, что я меньшего размера, который покрывает другие изображения

http://coding.smashingmagazine.com/2010/03/26/css-sprites-useful-technique-or-potential-nuisance/

Загрузка страницы может уменьшить ДО 10X фактора, когда они использование оптимально !!

Надеется, что это помогает