Comments 10
Webp-файлы обычно гораздо меньше, чем файлы, сохранённые в других форматах.Разве только в синтетических тестах. Реальные webp, создаваемые ImageMagick из тех же png, обычно оказываются больше, причём значительно, на треть где-то.
Как создавать сайты, которые будут хорошо работать на таком телефоне?Для начала хорошо бы сделать сайт таким, чтоб там не было ни строчки JS. Серьёзно, в XXI веке уже пора бы тем же «зелёным» создать движение Защиты Веба от Javascript, потому как проблема давно назрела и даже перезрела. Ведь страшно даже представить, сколько электроэнергии тратиться на обработку этих скриптов, при том что в 99% случаев в них нет особой необходимости.
А ещё бы хорошо всяким там W3C наконец собраться и придумать, как доработать стандарты, чтобы самые основные задачи, выполняемые JS, переложить на движок самого браузера.
Первое, для чего используется JS — сбор бессмысленной телеметрии, которая на самом деле в 99% случаев тупо лежит на серверах мёртвым грузом и никогда не используется. Но ведь куда эффективнее собирать её силами самого браузера! Добавляем в стандарт HTML тег:
<telemetry WhatToCollect submit="url">и все будут довольны. И телеметрия будет собираться, и тормозов не будет. Второе по важности применение JS — показ баннеров. Ну добавьте вы уже тег, аналогичный тегу video, чтоб не тормознутым JS, а силами самого браузера эти баннеры крутить:
<banner width="..." settings=... src=Google|Yandex|etc>и будет всем счастье без JS этого тормознутого.
AMP?
А ещё бы хорошо всяким там W3C наконец собраться и придумать, как доработать стандарты, чтобы самые основные задачи, выполняемые JS, переложить на движок самого браузера.
Ни один комитет не сможет решить за всех то, какие задачи основные, а какие — нет. Если пытаться пропихнуть в стандарт решения для частных задач, а действия, которые сейчас приходится реализовывать с помощью JavaScript полностью переложить на плечи браузера, то в конечном счете стандарт моментально раздуется, а «нагрузка» навряд ли значительно уменьшится. Все-таки те же самые действия по прежнему будут выполняться. Это если пофантазировать.
Реальные webp, создаваемые ImageMagick из тех же png, обычно оказываются больше, причём значительно, на треть где-то.
Можете показать примеры изображений? Мне интересны примеры, где webp не работает.
В наших проектах (не связанных с вебом) проводили начальное исследование эффективности сжатия на конкретном (не синтетическом) контенте, и выигрыш по размеру был существенным — в среднем сжатые изображения весили 25% от начального размера PNG
Изображения с чёткими цветовыми границами и отсутствием градиентов экстремально плохи для WebP. Как пример, Pixel Art и спрайтовые листы / иконки.
Чем меньше в изображении контрастных границ и больше плавных переходов, тем WebP лучше. Но тут он уже конкурирует не с PNG, а с JPEG, и далеко не всегда успешно.
Чем меньше в изображении контрастных границ и больше плавных переходов, тем WebP лучше. Но тут он уже конкурирует не с PNG, а с JPEG, и далеко не всегда успешно.
Официальный гугловский энкодер (cwebp v1.0.3) при максимальном lossless-сжатии (-z 9) даёт:
10964 -> 8876 (-19%)
1255 -> 1072 (-15%)
48013 -> 43620 (-9%)
Экономия вполне себе есть, хотя и меньшая, чем можно было бы ожидать из среднебольничных бенчмарков. Но это вполне объясняется большой специфичностью изображений (две из трех картинок 2-битные). Во всяком случае, хуже уж точно не становится.
Так что дело либо в некачественной реализации ImageMagick, либо что-то не то с настройками.
10964 -> 8876 (-19%)
1255 -> 1072 (-15%)
48013 -> 43620 (-9%)
Экономия вполне себе есть, хотя и меньшая, чем можно было бы ожидать из среднебольничных бенчмарков. Но это вполне объясняется большой специфичностью изображений (две из трех картинок 2-битные). Во всяком случае, хуже уж точно не становится.
Так что дело либо в некачественной реализации ImageMagick, либо что-то не то с настройками.
Реальные webp, создаваемые ImageMagick из тех же png, обычно оказываются больше
Размер png-файлов сильно зависит от характера изображения, нужно уделить внимание областям с одинаковыми пикселями.
Фотография (изображение, где в принципе не может быть больших областей с одинаковыми пикселями, хотя бы из-за шума матрицы) в формате png будет занимать мегабайты, тогда как в webp можно будет ужать ее до десятков килобайт.
А, например, экспортированный из svg баннер, скриншот интерфейса приложения, или что-то подобное в png будет занимать зачастую пару сотен килобайт, но в webp так или иначе будут артефакты (если не сжимаем lossless) даже при размере в те же десятки килобайт.
Дело не в форматах, дело в характере самого изображения
UFO just landed and posted this here
Эти инструменты помогают мне украсить HTML, CSS и JavaScript
надеюсь, это поможет
- jsonformatter.org/css-beautifier за CSS
- codebeautify.org/htmlviewer за HTML
- jsonformatter.org/jsbeautifier за Javascripts
надеюсь, это поможет
//не по теме
Снова Я
Нашел еще ошибки в той статье
«const list = []»
Очень часто «list» используется в качестве переменной, что запрещено
Снова Я
Нашел еще ошибки в той статье
«const list = []»
Очень часто «list» используется в качестве переменной, что запрещено
Sign up to leave a comment.
Красота прогрессивных улучшений