Максимальные размеры изображения в спецификации браузера/CSS?
Я хочу отобразить страницу, содержащую около 6000 миниатюр миниатюрных изображений (40х40 каждый). Чтобы избежать необходимости делать 6000 HTTP-запросов, я изучаю CSS-спрайты, т.е. Конкатенацию всех этих эскизов в одну длинную полосу и использование CSS для обрезки необходимых изображений. К сожалению, я обнаружил, что файлы JPEG не могут быть больше 65500 пикселей в любом одном измерении. Опасаясь дополнительных ограничений в веб-стеке, мне интересно: не могут ли какие-либо из перечисленных ниже проблем справиться с изображением размером 40x240000?
- Internet Explorer
- Opera
- WebKit
- Любая спецификация CSS
- Любая спецификация HTML
- Спецификация PNG
Изменить: цель состоит в том, чтобы просто отобразить всю коллекцию изображений сразу, требуя, чтобы пользователь не мог прокручивать. Я хочу, чтобы "мини-эскизы" вливались в существующий макет CSS, поэтому я не могу просто использовать большой прямоугольный образ. Я не хочу, чтобы пользователь должен был щелкнуть по нескольким страницам, чтобы увидеть все. Общее количество пикселей не так велико - только в два раза больше, чем на дисплее 2560x1600. Общий размер файлов всех мини-миниатюр составляет всего пару мегабайт. Предполагая, что каждое изображение управляется несжатым в памяти браузера, беря 8 байт памяти на пиксель (RGBA плюс 100% накладной коэффициент fudge), мы говорим об использовании ОЗУ в сотых мегабайтах; не является необоснованным для специализированного приложения в 2010 году. Единственным необоснованным является объем HTTP-запросов, которые будут сгенерированы, если бы все мини-эскизы были отправлены индивидуально.
Ответы
Ответ 1
Ну, Safari/iOS перечисляет эти ограничения:
-
Максимальный размер декодированных изображений GIF, PNG и TIFF составляет 3 мегапикселя.
То есть, убедитесь, что ширина * высота ≤ 3 * 1024 * 1024. Обратите внимание, что декодированный размер намного больше, чем размер кодированного изображения.
-
Максимальный размер декодированного изображения для JPEG составляет 32 мегапикселя с использованием подвыборки.
Изображения JPEG могут быть до 32 мегапикселей из-за подвыборки, что позволяет JPEG-изображениям декодироваться до размера, который имеет шестнадцатое число пикселей. Изображения JPEG размером более 2 мегапикселей подвыборки, то есть декодируются до уменьшенного размера. Подвыборка JPEG позволяет пользователю просматривать изображения с последних цифровых камер.
-
Индивидуальные файлы ресурсов должны быть меньше 10 МБ.
Это ограничение применяется к HTML, CSS, JavaScript или не связанным с ними средству.
http://developer.apple.com/library/safari/#documentation/AppleApplications/Reference/SafariWebContent/CreatingContentforSafarioniPhone/CreatingContentforSafarioniPhone.html
Ответ 2
Основываясь на вашем обновлении, я по-прежнему рекомендую не использовать этот подход. Разве вы не думаете, что причина в том, что поиск изображений Google не работает так?
Таким образом, я бы рекомендовал просто загружать изображения по мере необходимости через Ajax. (т.е. когда пользователь прокручивается ниже текущего видимого набора изображений.) Хотя это будет использовать большее количество подключений, это будет означать, что вы можете иметь значки с размерами и, как общий подход, гораздо более управляемым, чем необходимость повторного генерации pre -генерированные миниатюры "листы" на задней панели при добавлении нового изображения и т.д.