TGViewer
Senior Frontend - javascript, html, css Senior Frontend - javascript, html, css @seniorfront · 23.9K subscribers
Post #5733 8.52K
Как работает JPEG: магия, обманывающая ваши глаза

Вы когда-нибудь задумывались, почему JPEG при сжатии в 10 раз выглядит почти идеально, а при 100 — рассыпается на «кашу» из квадратов?

Вот основные этапы этой инженерной магии:

🌈Цветовой обман (YCbCr): Человеческий глаз лучше видит яркость, чем оттенки. JPEG переводит картинку в формат, где яркость отделена от цвета, и... просто выкидывает половину цветовых данных. Вы этого даже не заметите!

🟦 Сетка 8x8: Изображение режется на блоки.
Именно их мы видим как «артефакты», когда перебарщиваем со сжатием.

🔄 Магия частот (DCT):
Каждый блок превращается из набора пикселей в набор «частот».

🎚 Квантование:
Тот самый ползунок «Quality» в редакторах. На этом этапе алгоритм решает, сколько мелких деталей превратить в нули. Больше нулей — меньше вес файла, но хуже картинка.

Потыкать интерактивные примеры и увидеть DCT в действии можно здесь 👇
  • ❤ 1
  • 🔥 1
More from @seniorfront
  1. Sep 15, 2026🔴 Тестовый собес на Frontend-разработчика со старшим разработчиком ex. Сбер в этот четвер…
  2. Sep 2, 2026🪄 Как убрать лишний div, не трогая HTML В CSS сетка или флексбокс действуют только на пря…
  3. May 28, 2026Нативный CSS-скоупинг: как изолировать стили без сборщиков Если вы работали с Vue или Svel…
  4. May 11, 2026Валидация на чистом CSS: считаем поля через :nth-child(n of selector) Раньше для проверки…
  5. Apr 16, 2026SVG-фильтры: от «магии» к пониманию Если CSS-фильтры - это готовые инста-фильтры, то SVG-ф…
  6. Apr 2, 2026📄 Эффект загнутого угла на чистом CSS Интересный разбор от Kitty Giraudel. Традиционно «з…
Threads Profile ViewerView any public Threads profile without an account.Open ThreadLook →Writing with AI? Make it sound human.Metric37 rewrites AI drafts so they read naturally. Free AI detector, 1,500 words free.Try Metric37 →