Генерация спрайтов CSS для динамических изображений
У меня есть веб-страница, которая содержит приблизительно 20 - 50 динамических изображений (изображения, врученные из нестатического источника). Эти изображения вручены через сервлет на основе URL запроса. Это приводит к запросу, сгенерированному на изображение, которое приводит к затуханию производительности.
Если бы эти изображения были статическими, то я создал бы спрайт CSS и заменил бы 50 запросов единственным. Поскольку они являются динамичными, это не настолько легко, конечно. Я ищу инструмент/библиотеку/метод, который я могу использовать для агрегации этих изображений в единственный спрайт во времени выполнения. К счастью размер изображения является постоянным и то же для всех, которые должны сделать это намного легче.
Какие-либо предложения?
2 ответа
Вы можете проверить и попробовать JAWR ( https://jawr.dev.java.net/ ) Библиотека для генерации / модификации (также сжатия, объединения) CSS-файлы на сервлете. Он имеет возможность динамически изменить фоновые изображения. Вы можете организовать пачки для переключения файлов CSS для смены кожи (ы).
Плюс сторона: вы также можете управлять и организовать свои файлы .js тоже!
Вы можете добавить изображения с бесплатным библиотекой ImageMagick , через звонок в командную строку системы, поэтому у вас намного меньше кода в Java, и это быстрее.
Для присоединения горизонтально используйте эту команду:
convert image1.gif image2.gif image3.gif +append result.gif
Для добавления вертикально используйте эту команду:
convert image1.gif image2.gif image3.gif -append result.gif
для получения дополнительной информации: http://www.imageMagick.org/usage/layers/#append
Итак, с CSS, вы можете отобразить спрайты, используя одно изображение с простой смещением (вы можете использовать приметку CSS «Фон» для загрузки изображения и установить смещение одного спрайта, который вы хотите отобразить). Не требуется JavaScript, если вы делаете только простые вещи.