Быстрый вопрос об использовании спрайтов CSS и памяти

Ну, это больше связано с изображениями и памятью в целом. Если я использую одно и то же изображение несколько раз на странице, будет ли каждое изображение объединено в памяти? Или каждый образ использует отдельный объем памяти?

Меня беспокоит это, потому что я создаю систему скинов для гаджета Windows Desktop, и я ищу, чтобы писать изображения на скине по умолчанию, чтобы я мог поддерживать файловую систему в чистоте. В то же время я хочу попытаться свести объем памяти к минимуму. Если в конечном итоге я получаю один файл, содержащий 100 изображений, и повторно использую это изображение 100 раз в гаджете, я не хочу иметь проблемы с производительностью.

Приветствия.

Ответ 1

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

Я рассказываю вам протестировать его из-за этого интересного сообщения от Владимира, даже одобренного В Mozilla "использовать спрайты разумно" :

(...), где это изображение используется как спрайт. Обратите внимание, что это PNG размером 1299x15000. Он довольно хорошо сжимается - фактический размер загрузки составляет около 26 КБ, но браузеры не отображать сжатые данные изображения. Когда это изображение загружается и он будет использовать почти 75 МБ в памяти (1299 * 15000 * 4).

(В конце сообщения Владимира есть еще несколько замечательных ссылок для проверки)

Так как я не знаю, как Windows отображает его гаджеты (и если он не будет обрабатывать сжатые данные изображения), он может заставить ИМХО точно сказать, какой подход лучше без тестирования.

РЕДАКТИРОВАТЬ: Официальный Настольный блог Windows (не обновляется с 2007 года) говорит HTML-среда исполнения, используемая для Windows Gadgets, - это MSHTML, поэтому я считаю, что тест действительно необходим, чтобы знать, как ваше приложение будет обрабатывать спрайты CSS.

Однако, если вы прочитали некоторые официальные Гаджеты для рабочего стола Windows и Боковая панель Windows, есть интересная вещь о вашем решении не использовать css спрайты, в GIMAGE Протокол:

Этот протокол полезен для добавления изображения в гаджет DOM подробнее эффективно, чем стандартный HTML тег. Результаты этой эффективности от улучшенной обработки эскизов и кэширование изображений (он попытается использовать миниатюр из кеша Windows, если запрошенный размер меньше 256 пикселей на 256 пикселей) при сравнении с запросом изображения с помощью file://или http://. Добавленный преимущество протокола gimage заключается в том, что любой файл, отличный от стандартного изображения файл может быть указан как источник, и значок, связанный с этим файлом тип отображается.

Я бы попытался использовать этот протокол вместо спрайтов CSS и сделать некоторые тесты тоже.

Если ни одна из этих сведений вам не поможет, я постараюсь спросить Официальные форумы Windows Desktop Gadgets.

Удачи!

Ответ 2

Изображение будет отображаться один раз в кеше (до тех пор, пока URL-адрес будет одинаковым, и к имени файла не будет добавлена строка запроса). Спрайт - это путь.

Ответ 3

Webbrowsers идентифицирует кэшируемые ресурсы с помощью ETag заголовка ответа. Если он отсутствует или отличается от запросов, изображение может быть загружено и сохранено в кеше несколько раз. Если вы (фактически, веб-сервер) поставляете уникальный и тот же заголовок ETag для каждого уникального ресурса, то любой приличный веб-браузер достаточно умен, чтобы сохранить его в кеше и повторно использовать, если его Expires позволяет.

Любой достойный веб-сервер будет автоматически предоставлять заголовок ETag для статических ресурсов, он часто генерируется автоматически на основе комбинации локального имени файла, длины файла и последней измененной метки времени. Но часто они не добавляют заголовок Expires, поэтому вам нужно добавить его самостоятельно. После оценки вашей истории сообщений здесь, в Stackoverflow, я уверен, что вы знакомы с Apache HTTPD как веб-сервером, поэтому я предлагаю взглянуть на mod_expires, чтобы узнать, как настроить его самостоятельно для оптимального.

Вкратце, используйте изображение спрайта вместе с заголовком ETag и далеким будущим Expires, и все будет хорошо.