Почему при наведении в процессе трансформации ухудшается качество?

Question

[Ермахан Сабыржанов]

Почему когда идет масштабирование (transform: scale(n); transition: transform ns) снижается качество и фокусируется на последнем этапе?)
Код: https://codepen.io/ErmaKing/pen/VrZLaW
Кстати, как вам, что посоветуете?))

Comments

[Роман]

Все что мне известно - ЭТО НОРМАЛЬНО))

[Евгений Вольф]

Не могу к сожалению Вам точно ответить, но кажется, это связано с тем, что браузер (по какой-то причине) просчитывает промежуточные значения по упрощенному алгоритму, что бы "не тормозило", аналогичный эффект иногда можно наблюдать при первичном анализе (открытии) JPEG-файлов (т.е. на "начальном этапе загрузки").

[Сергей delphinpro]

Евгений Вольф, здесь и в джипегах совершенно разные явления

[spike__x]

Без transition меньше плавность, зато больше резкость =)

[Евгений Вольф]

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

[Moskus]

Евгений Вольф, False analogy fallacy, иначе говоря - типичный ложный вывод о сходстве явлений по вторичным чисто внешним сходным признакам.

[Moskus]

Ермахан Сабыржанов, это нормально. Ненормально - бесконечное использование дробных значений в пикселях (округлите до целых). Еще, можете слегка замаскировать эффект, добавив легкую тень от текста. Но совсем он не пропадет.

[Евгений Вольф]

Moskus, ну... на данный момент, ложность моего вывода пока ещё ни кем (и ни чем) объективным не доказана, иначе говоря - типичный ложный вывод о другом выводе :)))

[Moskus]

Евгений Вольф, это уже просто смешно.
Ситуация с декодированием JPEG связана с прогрессивным декодированием, когда сначала показывается изображение меньшей детализации, потом большей.
Ситуация с искаженным изображением текста при трансформации связана с использованием интерполяции nearest neighbor (целочисленным округлением).
Общего между ними - только видимая "зубчатость" изображения, имеющая совершенно разную природу.

Сказали ерунду - имейте смелость признать, а не упираться и ссылаться на "не пойман - не вор".

[Евгений Вольф]

Moskus, всегда приятно пообщаться с коллегой владеющим вопросом столь глубоко! :)))

[Antony Bark]

Если вас одолевает перфекционизм, используйте обычный image size вместо transistion, этим вы обойдёте неизбежный "некрасивый" рендеринг пикселизации браузера