Используя файл изображения по сравнению с данными URI в CSS
Спасибо Chris. Это - то, что я искал. Однако обратите внимание, что метод, сериализируют (). И существует другой метод serializeArray (), который выглядит очень полезным, который я могу использовать. Спасибо за указание на меня в правильном направлении.
var queryString = $('#frmAdvancedSearch').serialize();
alert(queryString);
var fieldValuePairs = $('#frmAdvancedSearch').serializeArray();
$.each(fieldValuePairs, function(index, fieldValuePair) {
alert("Item " + index + " is [" + fieldValuePair.name + "," + fieldValuePair.value + "]");
});
3 ответа
Я не думаю, что вы много выиграете ... и если это изображение файла, браузер может его кэшировать. Я бы не стал делать это с помощью CSS, если он вам не нужен.
Есть веская причина для использования URI данных, а не изображения.
URI данных закодирован по базе 64, что означает, что он примерно на 25% больше изображения. Однако ваш файл CSS можно кэшировать, поэтому небольшое увеличение размера, вероятно, не является большой проблемой.
Если у вас много изображений, есть накладные расходы на поиск каждого из них, как с точки зрения разрешения имени, так и с точки зрения получения изображения как другого ресурса.
Все это означает, что если изображения маленькие, а общий файл CSS по-прежнему невелик, а CSS используется совместно между страницами, которые часто посещаются, то вы можете повысить производительность, если переключитесь на URI данных.
Обратной стороной является то, что они работают только в FX, Chrome и т.д. Частично работают в IE8, но только для небольших изображений. Они вообще не работают в IE7 или ниже.
Я думаю, что сейчас это незначительно ... (одно маленькое изображение?)
Однако есть еще кое-что, что следует учитывать:
- Будет ли возможность сделать больше изображений в будущем?
- Вы архивируете свои файлы css?
Причина в том, что ...
Для каждого изображения, загруженного в css, на один вызов сервера меньше, что требует времени. Все мы знаем это по спрайтам. Даже спрайт большего размера, чем все изображения вместе взятые, предпочтительнее.
Это означает, что каждое добавленное изображение дает на одно потенциальное замедление меньше, если вы используете data: URI.
и по второму вопросу .. data: URI ОЧЕНЬ дружелюбен к gZip. Я имею ввиду ОЧЕНЬ. У нас есть несколько устаревших файлов css, которые огромны. 109 кб огромно .. и когда мы данные: URI изображения, которое раздувается до колоссальных 246 кб! После gZipping мы уменьшаем размер до 126 КБ.
Не говоря уже о том, что поддерживать спрайты неинтересно, но если вы используете data: URI, причин для спрайтов гораздо меньше.
Надеюсь, что это поможет.
PS. ссылка на данные: URI. http://www.nczonline.net/blog/2010/07/06/data-uris-make-css-sprites-obsolete/#comment-5800
PS PS проверьте внизу этой страницы, чтобы узнать больше, что Николас говорит о данных: URI