Анализ принципа сжатия изображений PNG

задний план

Сегодня в час ночи кто-то вдруг добавил мой QQ, и это оказалась моя первая любовь, которую я удалил десять лет назад. . . .

Поскольку раньше в пространстве QQ было слишком много взаимодействия, друзья, рекомендованные QQ, часто рекомендуют нам познакомиться друг с другом. . . . Смущение тайны

После того, как я согласился на заявку в друзья, я внимательно посмотрел всю ее динамику QQ и фотографии за последние десять лет. Она стала красивой и может наряжаться.С ее худощавым телом раньше и ее нынешним платьем и макияжем она уже богиня вне моего понимания.

А я все еще посредственный, с постепенно раздувшимся телом и поднимающейся линией роста волос, много работаю и бегаю всю жизнь каждый день, и все еще беден.

Одно слово, чтобы описать, что я чувствую прямо сейчас: «Ты достиг более высокого пика, и я могу только прикрывать твою спину».

Молча закурил и сохранил все фотографии своей красотки. Хм? Выяснено, что каждая фотография имеет формат изображения .png. png? ? Мы используем png-изображения каждый день, но что такое png и каков принцип его сжатия? Очень хорошо, я объясню это вам один за другим.

Что такое PNG

Полное название PNG — Portable Network Graphics (Переносимая сетевая графика), который в настоящее время является наиболее популярным форматом изображения для передачи и отображения по сети.Причин тому несколько:

无损压缩: изображение PNG сжимается на основе производного алгоритма LZ77, что обеспечивает более высокую степень сжатия, а сгенерированный файл имеет меньший размер и не теряет данные.
体积小: использует специальный метод кодирования для маркировки повторяющихся данных, уменьшая размер файлов изображений PNG для изображений в том же формате. Из-за ограничений полосы пропускания при передаче данных по сети предпочтительны изображения в формате PNG, поскольку они обеспечивают четкость и реалистичность изображения.
支持透明效果: PNG поддерживает определение 256 уровней прозрачности для исходного изображения, так что края изображения можно плавно смешивать с любым фоном, что недоступно в форматах GIF и JPEG.

Тип PNG

Существует три основных типа изображений PNG: PNG 8 / PNG 24 / PNG 32.

PNG 8: 8 в PNG 8 на самом деле относится к 8 битам, что эквивалентно использованию 2 ^ 8 (2 в 8-й степени) для хранения цветового типа изображения. 2 ^ 8 равно 256, что означает, что PNG 8 может хранить 256 Если изображение имеет несколько видов цветов, очень удобно установить тип изображения PNG 8.
PNG 24: 24 в PNG 24, что эквивалентно 3 умножить на 8, равно 24, означает использовать три 8 бита для представления R (красный), G (зеленый), B (синий). R (0 ~ 255), G (0 ~ 255), B (0 ~ 255) может отображать 256 раз 256 раз 256 = 16777216 цветов изображения, поэтому PNG 24 может отображать более насыщенные цвета, чем изображение PNG 8. Но занимаемая площадь относительно больше.
PNG 32: 32 в PNG 32, что эквивалентно PNG 24 плюс 8-битный канал прозрачного цвета, что эквивалентно R (красный), G (зеленый), B (синий), A (прозрачный). R(0~255), G(0~255), B(0~255), A(0~255). Существует на один A (прозрачность) больше, чем PNG 24, что означает, что PNG 32 может отображать столько же цветов, сколько PNG 24, а также поддерживает 256 прозрачных цветов, которые могут представлять более богатые типы цветов изображения.

Как сказать, в общем, PNG 8/PNG 24/PNG 32 эквивалентны сердцу нашей диаоси, разделив богиню на три категории:

一类女神 = PNG 8: Дяоси лижут собак, увидев богиню первого типа, они сразу же почувствуют себя счастливыми и улыбающимися, а почерневший Иньтан Дяоси постепенно растянется.
二类女神 = PNG 24: Второй тип богини начинает проявлять силу, и это вызовет у диаоси своего рода оглушительный шок.Больше контактов со вторым типом богини может заставить диаоси чувствовать себя бодрее и жить дольше с каждым днем.
三类女神 = PNG 32: Перед богиней третьего разряда весь язык кажется бледным. Это было своего рода высшее существование, которое заставляло диаоси видеть насквозь, с руками и глазами, достигающими неба. Потустороннего и богов недостаточно, чтобы описать половину ее красоты. Я видел это только во сне.

Привет. . . Моя первая любовь, глядя на ее нынешнее фото, должна была коснуться уровня PNG 24.

Структура данных изображения PNG

Структура данных PNG-изображения на самом деле очень похожа на структуру http-запроса: это заголовок данных, за которым следует множество блоков данных, как показано на следующем рисунке:

Если вы откроете изображение png в режиме кодирования представления vim, оно будет выглядеть так:

Держа в руках траву, кажется ли этот кусок шестнадцатеричного кода таким же неясным, как разум богини на первый взгляд?

Брат, не паникуй, по правде говоря, если бы это было так просто, как набор перепутанных букв, мы с братом уже были бы в группах жен и наложниц. Далее я объясню значение этой группы шестнадцатеричных кодов один за другим.

8950 4e47 0d0a 1a0a: Это заголовок изображения PNG. Заголовки всех изображений PNG кодируются этой строкой. Программное обеспечение для обработки изображений определяет, является ли файл изображением в формате PNG, с помощью этой строки кодировок.

0000 000d: длина блока данных iHDR, равная 13.

4948 4452: это тип блока данных, то есть IHDR, за которым следуют данные.

0000 02bc: ширина изображения.

0000 03a5: высота.

И так далее, каждый шестнадцатеричный код представляет определенное значение. Остальное нижеследующее разбирать по одному не буду, их слишком много, можете проверить сами.

Какие изображения PNG больше подходят для сжатия

Для обычного изображения в формате png чем проще цвет, тем меньше значение цвета и выше степень сжатия, например следующее изображение:

Он состоит только из красного и зеленого.Если для красного используется 0, а для зеленого — 1, то изображение представляется числами следующим образом:

00000000000000000

1111111111111111111111111

Мы видим, что в этом изображении используется много повторяющихся чисел. Мы можем удалить повторяющиеся числа и напрямую использовать форму массива [0, 1] для прямого представления этого изображения. Используются только два числа. Оно может представлять большое изображение, которое сильно сжимает изображение png.

так! Чем более одиночный цвет, тем меньше цветовых значений, меньше цветовая разница, выше степень сжатия и меньше размер.

Сжатие PNG

Сжатие PNG-изображений делится на два этапа:

预解析（Prediction）: Этот этап предназначен для предварительной обработки изображения png и делает его более удобным для последующего сжатия после обработки. Прямо скажем, она богиня, перед макияжем сначала наносит базу, сначала наносит лосьон и эссенцию, что удобно для последующего макияжа, отбеливания, теней, полировки и так далее.
压缩（Compression）: Выполняет сжатие Deflate, которое объединяет алгоритм LZ77 и алгоритм Хаффмана для кодирования изображений.

Прогноз

Изображение png предварительно обрабатывается дифференциальным кодированием (дельта-кодированием), и обрабатывается значение каждого канала в каждом пикселе.В основном существует несколько типов дифференциального кодирования:

не фильтровать
X-A
X-B
X-(A+B)/2 (средний)
Вывод Паэта (это сложнее)

Предположим, изображение в формате png выглядит следующим образом:

Это изображение представляет собой карту цветов градиента с постепенно увеличивающимся красным цветом, его красный цвет постепенно увеличивается слева направо, а значения, отображаемые в массив, равны [1, 2, 3, 4, 5, 6, 7, 8], используя XA для дифференциального кодирования, то есть:

[2-1=1, 3-2=1, 4-3=1, 5-4=1, 6-5=1, 7-6=1, 8-7=1]

Полученный результат

[1,1,1,1,1,1,1]

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

Вот почему градиентные изображения, изображения с небольшим изменением цветового значения и изображения одного цвета легче сжимать.

Целью дифференциального кодирования является максимально возможное преобразование значений данных изображения png в набор повторяющихся низких значений, которые легче сжимать.

Наконец, следует отметить, что дифференциальное кодирование обрабатывает значение каждого цветового канала в каждом пикселе, а значения R (красный), G (зеленый), B (синий) и A (прозрачный) четырех обработанных цветовых каналов по отдельности.

Сжатие

Этап сжатия будет дефлировать результат, полученный на этапе предварительной обработки, который состоит из кодирования Хаффмана и сжатия LZ77.

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

Deflate — это алгоритм сжатия потоков данных, который можно использовать везде, где требуется потоковое сжатие.

Кроме того, как мы уже говорили ранее, изображение png состоит из множества блоков данных, но некоторая информация в блоках данных на самом деле бесполезна. Например, если изображение png сохраняется с помощью Photoshop, будет запись блока «Это изображение». был создан фотошопом», большая часть такой информации бесполезна, если вы используете «экспортный веб-формат» фотошопа, чтобы избавиться от этой бесполезной информации. Эффект сравнения до и после экспорта в веб-формат показан на следующем рисунке:

Видно, что после экспорта в веб-формат и удаления большого количества бесполезной информации картинка явно стала намного меньше.

Эпилог

Вышеупомянутое мое понимание png.Он не очень хорошо написан, как разрозненный человек среднего и пожилого возраста, неорганизованный.

Я помню, что причина, по которой я расстался со своей первой любовью в том году, заключалась в том, что я боялся повлиять на свою учебу. . . Но после разлуки результаты все равно очень плохие, мало того, что богиню упустили, так еще и ничего.

Теперь, когда он уже немолод, обременен огромной ипотекой, а дома еще дети, которые ждут, чтобы их покормили... Глядя на свою спящую жену, которая мурлычет рядом с ним, он вдруг задумывается об этом.

Как сказал Лу Синь:

"Любовь подобна собиранию ракушек на берегу, не бери самую большую, не бери самую красивую, если хочешь брать, бери то, что тебе больше всего нравится, а самое главное - возьми то, что тебе нравится, и никогда больше не ходи на пляж».

. . . . . .

Написав статью в четыре утра, я по незнанию заснул

Мечтая вернуться к тому лету десять лет назад, мы все сладко смеялись

Посмотри на свое плачущее лицо и попрощайся со мной с улыбкой

до свидания