Что такое пиксель

Пиксель — наименьший элемент растрового изображения: одна клетка сетки, у которой есть ровно один цвет. Собственного размера в миллиметрах у него нет, размер появляется только на экране или на отпечатке. В файле пиксель описан числами каналов: три на цвет и четвёртое на прозрачность. Поэтому снимок на двенадцать мегапикселей занимает в памяти браузера около сорока восьми мегабайт ещё до того, как его начнут сжимать.

Локально в браузередо 100 МБбез регистрации

Коротко о цифрах

Что хранит точка: три канала цвета по байту плюс байт прозрачности
Память на холсте: ширина × высота × 4 байта; 12 Мпикс ≈ 48 МБ
Физический размер: у точки его нет — только у экрана и отпечатка
Пресеты длинной стороны: 1920, 1280, 800 или исходный размер
A4 при 300 DPI: 2480×3508 точек = 8,7 мегапикселя

Из чего состоит одна точка

Три канала цвета — красный, зелёный и синий, по байту на каждый, то есть 256 градаций.
Четвёртый байт — доля непрозрачности; в JPEG его нет вовсе, поэтому прозрачность там невозможна.
На холсте браузера точка всегда занимает эти четыре байта, как бы плотно она ни была упакована в файле.
Отсюда оценка памяти в одно умножение: ширина на высоту и на четыре. Снимок 4000 на 3000 — это 48 МБ на один холст.

Почему точки решают вес файла

Количество точек растёт как площадь, а не как сторона. Уменьшив длинную сторону вдвое, вы убираете три четверти точек, а не половину. Именно на этом построены запасные проходы в сжатии до заданного размера: когда подбор качества упёрся в нижнюю границу и цель всё ещё не взята, сторона уменьшается до 0,7, а затем до 0,5 — на последнем коэффициенте от картинки остаётся четверть исходных точек.

Само сжатие уменьшает не число точек, а число байтов, которыми они описаны. JPEG кодирует не каждую точку отдельно, а квадраты восемь на восемь: на ровной заливке ему хватает единиц байтов на весь квадрат, а на мелкой ряби приходится тратиться почти на каждую точку. Отсюда и берётся разница в весе между двумя файлами с одинаковым числом пикселей.

Где это видно в наших инструментах

В сжатии фотографий есть выбор длинной стороны — 1920, 1280, 800 или без изменения. Это прямое управление количеством точек.
Обрезка точки не пересчитывает: вырезанный прямоугольник переносится один в один, поэтому вес падает ровно на выброшенную площадь.
У страницы PDF точек нет вовсе, пока её не растеризовали: A4 при 300 DPI даёт 2480 на 3508, то есть 8,7 мегапикселя.
Холст освобождается сразу после работы: на телефоне вкладка упирается примерно в гигабайт памяти и закрывается без предупреждения.

Частые вопросы

Мегапиксель — это сколько?

Миллион точек. Снимок 4000 на 3000 даёт ровно двенадцать миллионов, то есть двенадцать мегапикселей: число получается умножением сторон, а не их сложением.

Почему два файла с одинаковым числом точек весят по-разному?

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

Можно ли добавить точек и получить больше деталей?

Нет. Увеличение растягивает имеющиеся точки и досчитывает промежуточные по соседям, новых сведений о сцене в файле не появляется, поэтому наши инструменты картинку никогда не увеличивают.

Почему браузер закрывает вкладку на очень больших изображениях?

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