|
| 1 | +--- |
| 2 | +title: 'В этом выпуске мы поговорим о релизе Chrome 105 с Container Queries и :has(), алгебраических типах данных, кейсе миграции на React Router 6, релизе Deno 1.25, а также вероятности начала разработки российского игрового движка.' |
| 3 | +soundcloudLink: 'https://soundcloud.com/csssr/container-queries-i-has-v-chrome-105-algebraicheskie-tipy-migratsiya-na-react-router-6-deno-125' |
| 4 | +date: '2022-09-09T00:00:00.000Z' |
| 5 | +episodeNumber: 216 |
| 6 | +tag: 'news' |
| 7 | +author: 'Ислам Виндижев' |
| 8 | +--- |
| 9 | + |
| 10 | +Всем привет! Это «Новости 512» от CSSSR. В этом выпуске: Container Queries и :has() в Chrome 105, алгебраические типы данных в системах типов, кейс миграции на React Router 6, релизы Chrome 105, Deno 1.25, а также вероятность начала разработки российского игрового движка. |
| 11 | + |
| 12 | +В прошлом выпуске я говорил о том, что новости берут небольшую паузу. Напомню, что следующий выпуск новостей выйдет 30-го сентября. Теперь к эпизоду. |
| 13 | + |
| 14 | +<ParagraphWithImage imageName="laptopNews" > |
| 15 | + ### Интересные публикации |
| 16 | + |
| 17 | +Вышел Chrome 105, в котором появились сразу 2 фичи, которые уже довольно давно будоражат сердца и умы людей: :has() и Container Queries. Про Chrome 105 мы поговорим чуть позже, а пока — про Container Queries. Ахмад Шадид (Ahmad Shadeed) был в числе первых, кто попробовал новую фичу на ранних этапах. В своем блоге он опубликовал [статью](https://ishadeed.com/article/container-queries-are-finally-here/) (как бы приуроченную к выходу фичи), в которой делает обзор Container Queries, демонстрирует синтаксис и разные задачи, которые фича помогает решить. Кроме того, на отдельной странице он собрал примеры решения десятка распространённых задач ([ссылку](https://lab.ishadeed.com/container-queries) на страницу я также приложу к описанию выпуска). |
| 18 | +</ParagraphWithImage> |
| 19 | + |
| 20 | +Доктор Аксель Раушмаер (Dr. Axel Rauschmayer) порадовал нас новой [статьей](https://2ality.com/2022/09/nodejs-overview.html). Порадовал, потому что это отличный обзор Node.js. Здесь обзор архитектуры, структуры API и его особенностей. В статье подробно разбирается работа Event Loop (включая разбор фаз работы, тасков, микро-тасков и других нюансов) и ввода-вывода, треды и другие аспекты. Что ещё хорошо: в конце статьи есть полный список источников по каждому разделу статьи и отдельный список для дальнейшего чтения. |
| 21 | + |
| 22 | +Вышла вторая часть из цикла статей о сравнении разных систем типов от нашего коллеги Миши Медведева. Напомню, [первая](https://blog.csssr.com/en/article/type-systems-part-1/) была о типизации в целом: свойствах систем типов, примитивах, выводе типов и других базовых вещах. А [вторая часть](https://blog.csssr.com/en/article/type-systems-part-2/) посвящена алгебраическим типам данных. Это сложные типы, которые создаются как раз из примитивов. Например, это Union- и Sum-типы. Они подчиняются правилам алгебры при построении и их взаимодействии с другими типами. Эти же правила позволяют переиспользовать и комбинировать уже созданные типы, что делает алгебраические типы данных очень мощным инструментом. В сравнении участвуют всё те же TypeScript, PureScript и ReasonML. Больше подробностей — в нашем блоге. |
| 23 | + |
| 24 | +Продолжая тему типизации. Следующая статья — перевод первой части цикла «[TypeScript в деталях](https://habr.com/ru/company/timeweb/blog/685954/)». Это не столько пошаговый гайд, сколько расположенные по мере усложнения нюансы работы разных аспектов TypeScript. В первой части рассказывается про дженерики, условные типы, операторы `keyof` и `typeof`. Всё сопровождается хорошими скринами кода и пояснительными гифками. |
| 25 | + |
| 26 | +В техническом блоге Альфа-Банка была опубликована статья о [кейсе миграции с React Router 5 на React Router 6](https://habr.com/ru/company/alfa/blog/686954/). Старший разработчик Андрей Новиков рассказал о проблемах, которые привели к переходу. Затем прошла подготовка к переходу (например, переход на React 16.8 и другие манипуляции), потом непосредственно миграция (обновление до React Router 6.2, обновление кода роутинга и другое). Андрей также описал альтернативный способ инкрементального перехода при помощи CompatRouter — пакета, который появился с React Router 6.3. Больше подробностей — в оригинальной статье. |
| 27 | + |
| 28 | +Темани Афиф (Temani Afif) опубликовал на CSS Tricks [вторую часть](https://css-tricks.com/css-grid-and-custom-shapes-part-2/) своей статьи о сложных кастомных формах элементов в гридах. Здесь используется та же HTML-разметка, что и в [первой части](https://css-tricks.com/css-grid-and-custom-shapes-part-1/), но строятся другие, более сложные формы. Например, фотография, обтекаемая другими, разделение элементов зигзагообразными линиями, интересные внешние формы элементов сетки. Также присутствуют комбинации с разными эффектами. |
| 29 | + |
| 30 | +[Ещё одна статья Джоша Комо (Josh Comeau)](https://www.joshwcomeau.com/react/usememo-and-usecallback/) по React посвящена двум хукам: useMemo и useCallback. Если вы уже на «ты» с хуками, то, скорее всего, уже использовали их в работе. Здесь речь идёт о мемоизации. Разница в том, что useMemo нужен для мемоизации результатов вычислений (объектов или каких-то значений), а useCallback — для мемоизации самих коллбэков, чтобы они не пересоздавались. Джош рассказывает о разнице между хуками, приводит примеры и подходящие для их применения случаи. |
| 31 | + |
| 32 | +Далее материал в Smashing Magazine от автора Зары Купер (Zara Cooper). Зара поделилась [подборкой](https://www.smashingmagazine.com/2022/09/useful-javascript-data-grid-libraries/) полезных JavaScript-библиотек для построения таблиц с данными и разными полями. В статье собрано целых 12 библиотек: есть короткое описание каждой и тезисное описание основных фич. Неплохая подборка, чтобы выбрать подходящий инструмент для своего проекта. |
| 33 | + |
| 34 | +Завершит рубрику [подборка задач по промисам для собеседований](https://habr.com/ru/company/otus/blog/686670/). Это перевод на Хабре, в котором собраны 10 задач, проверяющие владение разными особенностями работы промисов. Задачи начинаются с простой (о конструкторе промисов), а заканчиваются сложными, решение которых требует понимания особенностей Event Loop. Наслаждайтесь. |
| 35 | + |
| 36 | +<ParagraphWithImage imageName="manWithLaptop"> |
| 37 | + ### Новости релизов |
| 38 | + |
| 39 | +Как я уже упоминал, состоялся релиз [Chrome 105](https://developer.chrome.com/blog/new-in-chrome-105/). В этой версии, наверное, самыми заметными фичами стали запросы от контейнера или Container Queries и псевдоселектор :has(). Подробнее о них вы можете прочитать, например, в [статье Уны Кравец (Una Kravets)](https://developer.chrome.com/blog/has-with-cq-m105/) или в [обзоре от Пита ЛеПейджа (Pete LePage)](https://developer.chrome.com/blog/new-in-chrome-105/). Был добавлен Sanitizer API, а для небезопасных контекстов задепрекейтили Web SQL. DevTools тоже отметился новыми фичами. Например, пошаговым повтором в Recorder, определением потенциальных причин сдвига разметки, поддержкой редактирования прямо во время дебага и другими нововведениями. Больше подробностей — как всегда, в обзорах [Пита ЛеПейджа (Pete LePage)](https://developer.chrome.com/blog/new-in-chrome-105/) и [Джеселин Ин (Jecelyn Yeen)](https://developer.chrome.com/blog/new-in-devtools-105/). |
| 40 | +</ParagraphWithImage> |
| 41 | + |
| 42 | +Также Firefox отметился ещё одним патчем с устранением нескольких проблем за номером [104.0.2](https://www.mozilla.org/en-US/firefox/104.0.2/releasenotes/). |
| 43 | + |
| 44 | +Вышел [Deno 1.25](https://deno.com/blog/v1.25). Ранее я рассказывал про планы Deno. Они начали воплощаться. Появилась экспериментальная поддержка npm-пакетов: разработчики подчеркивают, что это совсем экспериментальная фича, не готовая для использования в production. Ещё одна экспериментальная фича — новый API HTTP-сервера. Также было представлено ускорение старта рантайма, новый тип `buffer` и другие изменения. |
| 45 | + |
| 46 | +Также на этой неделе отмечу релиз [ESLint 8.23.0 ](https://eslint.org/blog/2022/08/eslint-v8.23.0-released/) с небольшими фичами и багфиксами, релизы [VSCode 1.71 ](https://code.visualstudio.com/updates/v1_71), [Lerna 5.5.0 ](https://github.com/lerna/lerna/releases/tag/v5.5.0) и [VirtualBox 6.1.38 ](https://www.mail-archive.com/[email protected]/msg00217.html). |
| 47 | + |
| 48 | +<ParagraphWithImage imageName="laptopNews" > |
| 49 | + ### Другие новости |
| 50 | + |
| 51 | +Продолжаются истории об импортозамещении. Вы уже могли видеть новость на VC или другом ресурсе о том, что [VK попросило Минцифры выделить 3 миллиарда рублей на разработку отечественного игрового движка](https://vc.ru/tech/496749-vk-poprosila-u-mincifry-3-mlrd-rubley-na-razrabotku-rossiyskogo-dvizhka-dlya-videoigr). Ранее такой запрос поступал и от Ростеха. Подтверждается, что Минцифры подготовило консультации на эту тему с представителями индустрии, то есть, как я понимаю, чтобы определить, давать денег или нет. Как всегда, радует реакция в сети: кто-то вспомнил BolgenOS, кто-то допустил, что за копейки купят неизвестный движок (переименуют — и профит), а кто-то из пользователей сети пошутил про Chebureal Engine. Такие вот дела. Посмотрим, появится ли когда-нибудь российский игровой движок. |
| 52 | +</ParagraphWithImage> |
| 53 | + |
| 54 | + ### Пишите нам и читайте |
| 55 | + [Telegram—канал CSSSR](https://t.me/csssr) |
| 56 | + |
| 57 | + [Twitter CSSSR](https://twitter.com/csssr_dev) |
| 58 | + |
| 59 | + [Twitter новостей](https://twitter.com/csssr_news) |
| 60 | + |
| 61 | + [Telegram ведущего](https://t.me/Vindizh) |
| 62 | + |
| 63 | + [Twitter ведущего](https://twitter.com/Vindizh) |
0 commit comments