Всем привет! Это «Новости 512» от CSSSR. В этом выпуске мы поговорим о формате цветов OKLCH, математических операторах сравнения в медиа-запросах, релиз-кандидате TypeScript 4.9, релизе Lerna 6 и security-релизах Node.js. Ещё мы немного поговорим о безопасности: о том, как Dropbox стала жертвой фишинга, и о новых мерах безопасности от npm.
Интересные публикации
Если вы следите за социальными сетями Андрея Ситника, вы могли обратить внимание, что он много говорит о новом способе описания цветов OKLCH из спецификации цветов 4-го уровня. Откуда ноги растут? Я попробую рассказать коротко. Человеческий глаз воспринимает цвета по-разному и какое-то их количество. Чаще всего мы имеем дело с цветовым пространством sRGB. Для выражения цветов из него и используется rgba из CSS. Существует более новая модель цветового пространства P3. P3 покрывает больше цветов, чем sRGB: примерно на 25% больше. Вот для описания цветов из P3 и нужна OKLCH-модель — во всяком случае гораздо лучше подходит. Об этом новая статья Андрея. В ней он как раз говорит о развитии цвета в CSS, сравнивает разные способы представления цветов и рассказывает, как работает OKLCH. OKLCH уже можно пользоваться в своих проектах. Существует некоторый тулинг и экосистема, пока в начальной стадии, об этом всем в статье тоже есть. Появляется всё больше устройств, которые могут работать в цветовом пространстве P3, и тенденция только нарастает, так что пора начать разбираться в OKLCH.
Я надеюсь, что из-за Container Query вы не забыли о том, что существуют обычные медиа-запросы. Они никуда не ушли и даже развиваются. Об этом статья Прети Селвам (Preethi Selvam) на CSS Tricks. Она рассказала о математических операторах сравнения в медиа-запросах. На самом деле такой синтаксис лично мне интуитивно хотелось использовать, и он довольно давно поддерживается в Firefox, а в Chrome с версией 104, а значит, и в новом Edge. В статье есть примеры, довольно базовые, но если вы совсем не слышали про такой синтаксис, обязательно взгляните — заметка совсем короткая.
Всем сервисам нужны улучшения и оптимизации. А особенно большим и высоконагруженным. Кейс улучшения веб-версии YouTube разбирают в блоге web.dev Эдди Османи (Addy Osmani) и Шрирам Кришан (Sriram Krishnan). Команда провела несколько экспериментов по улучшению метрик, поработала над стейт менеджментом между компонентами и модуляризацией разных компонентов. Работа коснулась мобильной веб-версии, и в итоге 76% мобильных URL стали проходить по метрикам Web Vitals. Во второй части будет разбор улучшений доступности для YouTube.
Завершилась серия статей, посвящённая оформлению изображений в теге img. Темани Афиф (Temani Afif) написал третью часть цикла. Она про оформление обводки и сложные анимационные эффекты. Смотрится очень круто. В статье есть примеры, пошаговый разбор принципа построения анимации и несколько примеров готовых анимаций. Некоторые смотрятся почти магически.
Адам Аргайл (Adam Argyle) продолжает создавать разные компоненты. В этот раз он взялся за тултип. Тултип создаётся поэтапно: сначала без JS, потом учитываться будет его расположение, стили, смена тем и доступность. Доступна и видеоверсия.
В прошлом выпуске мы обсуждали Next.js. Вполне возможно, что самое время попробовать с ним поработать, если вы этого ещё не делали. Представляю вашему вниманию crash course по Next.js. В видео — все основные моменты и больше практики, чем объяснений. Сначала вводная, обзорная часть, потом создание первого приложения и практический обзор основных возможностей фреймворка. Он занимает всего 2 часа с хвостиком, так что это довольно хороший вариант, чтобы попробовать технологию.
Новости релизов
Ожидаемо появился релиз-кандидат TypeScript 4.9. С этого момента будут вноситься только мажорные багфиксы, а релиз должен случиться в районе 15 ноября. Напомню, что будет добавлен оператор satisfies, который позволяет валидировать соответствие типа выражения какому-то типу без изменения результирующего типа. Оператор in станет более полезным при сокращении типов с отсутствующими свойствами. Ещё один лучик добра — это оберегалочка от прямого сравнения с NaN: теперь TS будет выводить ошибку и предлагать использовать не прямое сравнение, а другой метод. Ждём релиз 15 ноября.
Кстати говоря, был опубликован план по разработке пятой версии Typescript. Я не буду сейчас углубляться в фичи, потому что мы будем обсуждать их по мере выхода релизов. Скажу только, что в середине марта ожидается финальный релиз TypeScript 5.0. К выпуску я приложу ссылку на сам план, в нём можно посмотреть на предполагаемые фичи и таймлайн.
Ранее я несколько обходил стороной новый мажорный релиз Lerna, потому что не было времени посмотреть подробнее. Итак, вышла шестая версия с заголовком «Lerna reborn». В совсем перерождение верится слабо, но давайте посмотрим. В апреле этого года Lerna объявили мёртвой, после этого компания Nrwl взяла над ней шефство и начала работать над ней. В итоге, как пишут разработчики, Lerna стала в 10 раз быстрее, обросла фичами. Например, было добавлено кеширование по умолчанию, появилась поддержка pnpm. Для Lerna workspaces появился плагин в VSCode и встроенная команда lerna repair. Lerna в итоге зарекомендовала себя как не лучший инструмент, но время покажет, что получится из нового релиза. Подробнее о релизе — по ссылке в описании эпизода.
Прошёл октябрь, а значит, пришло время для security-релизов Node.js. Релиз коснулся 14, 16, 18 и 19 версий, в нём были устранены две проблемы высокой опасности и одна — средней. Кроме релизов безопасности вышла версия 14.21.0 с небольшим обновлением зависимости и добавлением флага --openssl-shared-config.
Команда Deno порадовала нас новым релизом 1.27.0. Было добавлено много улучшений для редакторов кода и IDE, продолжаются работы по улучшению поддержки Node.js. Как обычно, был представлен ряд стабилизаций разных API.
Кстати, с Deno связан релиз Babel 7.20. Эта версия поддерживает TypeScript 4.9 и Deno как целевую платформу для компиляции.
Вышла девятая мажорная версия npm. На самом деле релиз мажорный не из-за каких-то новых фич — просто разработчики избавились от большого количества легаси и заложили фундамент для дальнейшей разработки. 9-го ноября npm 9 будет доступен для широкого круга пользователей.
Также я отмечу октябрьский релиз VSCode 1.73 и релиз фреймворка Laravel 9.38.0.
Другие новости
Мастера фишинга нанесли новый удар. На этот раз жертва — Dropbox. Один из сотрудников получил письмо якобы от CircleCI, ссылка вела на поддельный сайт CircleCI, сотрудник ввел логин и пароль от своей учётной записи и использовал одноразовый код. В итоге злоумышленники получили доступ к ряду приватных репозиториев. Как сообщают в Dropbox, ничего важного в этих репозиториях не было. Речь идёт о 130 репозиториях с форками нужных библиотек, некоторых прототипов и других таких вещей. Разбор инцидента показал, что атака не привела к утечке из базы данных с пользователями и не затронула критическую инфраструктуру сервиса. Мораль: будьте бдительны.
Следующая новость тоже о безопасности, но покороче. npm обяжет мейнтейнеров пакетов с высоким влиянием включать двухфакторную аутентификацию. Причина понятна: в последнее время было довольно много атак, которые причинили или могли потенциально причинить много вреда. Как будут определять мейнтейнеров таких пакетов? Если у пакета больше миллиона скачиваний в неделю или более 500 зависимых пакетов, его мейнтейнеры будут обязаны включить 2FA. Они будут уведомлены об этом за 15 дней.