Тема важная, и я хочу немного её 'поднять' на поверхность:
При запуске сайта, НЕ ФАКТ, что он будет одинаково хорошо выглядеть во всех браузерах и устройствах, несмотря на одинаковое разрешение экрана🤷♂️
⠀
💥Сегодня расскажу о грандиозной подставе от Apple👇
⠀
Я не фанат яблочных устройств как пользователь, и я не очень люблю продукцию Apple как разработчик😶
⠀
Мы в компании активно занимаемся WEB разработкой, где приходится делать так, чтобы все наши результаты открывались одинаково хорошо во всех известных браузерах - в Google Chrome, Mozilla Firefox, Opera, ну и в Microsoft Edge (на всякий случай (если им ещё кто-то пользуется😅),
и конечно, Apple Safari.
⠀
До последнего обновления (iOS 14), Safari просто не загружал webp изображения🙈
⠀
WebP — формат изображений, созданный и развиваемый компанией Google. Этот формат обеспечивает сжатие изображений как с потерями, так и без потерь.
В нашей компании мы всегда экспериментируем с методами улучшения производительности сайтов. Мы запустили несколько A/B-тестов для понимания влияния WEBP на качество изображения, и то, каким способом его было бы неплохо внедрять в проекты.
⠀
Главная причина, почему мы начали внедрять WebP — уменьшение размера файла.
Что ведёт к увеличению скорости загрузки, а это, как мы помним, очень важно😏
⠀
WebP использует принципиально новый алгоритм сжатия, поэтому искажение выглядит иначе, относительно других типов файлов.
WebP оставляет четкие края фотографии, но при этом ухудшается детализация и текстура, что неизбежно при сжатии с потерями.
⠀
Возвращаясь к скорости загрузки, и о том, как это важно:
Наша команда предположила реализовывать метод, используя тэг для отдачи WebP-изображений браузерам, которые их поддерживают и отдачи JPEG или PNG тем, которые о WebP ничего не знают🤷♂️
Этот метод мы применяем на сайтах, нагруженных большим объемом изображений👍
⠀
В остальных случаях, вполне подходит классическое сжатие JPG изображений, и при небольшом количестве картинок на сайте, разница с WebP будет несущественна.
⠀
WebP пока не сможет полностью заменить JPEG или PNG, но он будет очень крутым инструментом в вашем арсенале.