Прогрессивный JPEG — это метод кодирования JPEG-изображений, при котором данные хранятся таким образом, что при загрузке изображение отображается постепенно. Сначала загружается низкое разрешение или менее детализированная версия, а затем, по мере получения новых данных, детализация улучшается.
Отличия от базового (Baseline) JPEG:
| Прогрессивный JPEG | Базовый JPEG |
|---|---|
| Изображение отображается постепенно, улучшаясь. | Изображение загружается сверху вниз, поблочно. |
| Подходит для медленного соединения. | Подходит для быстрого соединения. |
| Файл немного больше по размеру. | Файл немного меньше по размеру. |
| Требует больше процессорного времени для декодирования. | Требует меньше процессорного времени для декодирования. |
Применение в Frontend:
Технически, прогрессивный JPEG разбивает коэффициенты частот изображения на несколько сканов. Сначала передаются низкочастотные коэффициенты (общая структура), затем более высокочастотные (детали).
Пример преобразования базового JPEG в прогрессивный с помощью ImageMagick:
bashПример использования в CSS или HTML не отличается от обычного JPEG, так как это внутренний формат кодирования:
htmlcss