Всем привет, это «Новости 512» от CSSSR. В этом выпуске мы посмотрим на материалы по React, узнаем, чем может быть плох Effector и почему инструменты нужно выбирать внимательно, поговорим о тонкостях работы буфера обмена, общего буфера в Node.js и продолжим смотреть на цикл об алгоритмах и структурах данных на JS. В этом же выпуске релизы TypeScript 5.6, Vue 3.5, Firefox 130, а также старт опроса State of HTML 2024.
Интересные публикации
Этот выпуск начнётся с материалов по React. Команда Vercel глубоко окунулась в React 19, чтобы рассказать о новинках обновления своим читателям. Внутри обзор основным новых фич: серверных компонентов, новых директив, экшенов, новых хуков и API. Для серверных компонентов имеются очень понятные схемы, есть примеры по фичам и подробные объяснения. Получилось компактно и доступно — советую почитать, если хочется быть готовым к React 19.
Ещё одна фича, которая у всех на слуху, — это React Compiler. Напомню, что, грубо говоря, он оптимизирует код вместо вас и по идее должен значительно уменьшить количество оптимизаций руками разработчика. В статье через пример формулируется проблема и два варианта решения: без компилятора и с компилятором. После рассмотрения примеров работа компилятора разбирается более детально.
Продолжая тему React. Бред Вестфолл (Brad Westfall) в своей статье собрал самые актуальные и полезные приёмы для работы с формами и данными из них в React. Речь идёт о FormData, некоторых нюансах его работы, его трениях с TypeScript и о том, чем может пригодиться валидатор Zod. Заметка коротенькая, буквально на 5 минут.
В следующем материале Андрес Ковалёв из ВК рассказал об опыте использования Effector. Спойлер: опыт негативный. Андрес рассказывает, как в принципе выбирали менеджер состояний, как остановили свой выбор на Effector и о том, что в итоге пошло не так. Позже выяснилось, что преимущества стейт-менеджера не всегда преимущества, а команда столкнулась с множеством проблем. Статья — не хейт Effector, а скорее поучительный гайд о том, что инструменты нужно выбирать осознанно, с холодной головой, обязательно учитывая специфику проекта. Почитайте, очень интересно.
Инженеры Sentry поделились в блоге тем, как применяют мутационное тестирование для свсоего JS SDK. Концептуально метод такой: вы меняете код, новая версия кодовой базы становится мутантом, по мутанту прогоняются тесты, тесты либо не ловят баг (это значит, что мутант как бы выжил), либо ловят, падают, что-то ещё (это значит, что мутант не выживает). Процент невыживших мутировавших кодовых баз и есть результат — чем больше, тем лучше. Этот метод помогает понять, насколько эффективно ваши тесты проверяют проект на самом деле. Внутри статьи — про саму концепцию, про реализацию в Sentry SDK, выводы и дальнейшие планы.
Павел Романов в своём блоге делится опытом работы с многопоточностью на Node.js. Он рассказывает о том, как память может разделяться между потоками, как возникает состояние гонки и как атомики решают эту проблему. Естественно, в статье есть и примеры.
Частенько пользователи работают с буфером обмена (перевод). Существует профильный Clipboard API, а у самого буфера есть свои особенности, которые полезно знать. Алекс Харри (Alex Harri) в своём блоге в подробностях разбирает, как буфер хранит разные данные, как правильно с ними работать и какие есть особенности. Также он рассказывает про API, показывает примеры и старается объяснить всё как можно лучше. Получился длинный, подробный гайд.
Серия об алгоритмах и структурах данных на JS продолжается. С прошлого выпуска вышло ещё две части. В четвёртой части цикла разбираются дерево отрезков, дерево Фенвика, а также графы. Пятая часть посвящена системам непересекающихся множеств, фильтру Блума и кэшу актуальных данных. Если вам нужно поразбираться с алгоритмами, вся эта серия как раз для вас.
Теперь для ангуляристов. Это материал с 10 распространёнными архитектурными ошибками при работе с Angular. Здесь не только о неприменении разных фич фреймворка в нужных местах, но и о распространённых ошибках в принципе. Кому-то они могут показаться очевидными, но просмотреть стоит в любом случае.
В конце рубрики несколько быстрых материалов. Первый посвящён PHP и Laravel. Дейв Кисс (Dave Kiss) удивляется крутости Laravel и тому, что раньше на него не посмотрел. Если вы хотели попробовать побыть фулл-стеком, стоит попробовать.
Далее гайд по переносу Chrome-расширения на Safari. Название говорит само за себя, а материал пригодится всем авторам браузерных расширений.
Следом идёт видео о том, почему вам стоит использовать Redux в 2024 году. Если вы убеждённый хейтер, посмотрите — возможно, причины пользоваться им всё-таки есть.
И в завершении видео от команды VS Code. Оно о том, как ребята билдят и поставляют новые версии своего редактора.
Новости релизов
Вышел Firefox 130. Для элемента <details> пофиксили поддержку атрибута name, который позволяет сгруппировать элементы и создавать аккордеоны только с одним постоянно открытым элементом без использования JS. Были расширены возможности использования машинного перевода для страниц, исправлены баги. А ещё добавили новый раздел Firefox Labs для использования экспериментальных функций. Больше — в описании релиза.
TypeScript 5.6 уже доступен. В этой версии полностью доступны вспомогательные методы для итераторов и была добавлена поддержка произвольных идентификаторов модулей. TypeScript теперь будет отслеживать и показывать ошибки при возникновении всегда истинных утверждений или бессмысленных nullish-выражений, что уменьшит количество случайных ошибок в коде. Помимо этого, доступны опции --noCheck для пропуска проверки типов и --noUncheckedSideEffectImports для импорта модулей без каких-либо побочных значений. Больше подробностей — в блоге TypeScript.
Vue 3.5 (перевод) порадовал нас значительной оптимизацией системы реактивности. Буквально просто обновитесь и посмотрите, как падает потребление памяти (до 50%). Также была стабилизирована реактивная деструктуризация пропсов. В этой версии подвезли несколько улучшений для SSR, например ленивую гидратацию и метод для генерации ID для разных элементов. А для компонента defer и режим отложенной телепортации.
В Astro 4.15 были стабилизированы Astro Actions — решение команды фреймворка для полностью типобезопасных бэкенд-функций. Была добавлена поддержка libSQL как источника данных. Были и другие изменения, больше о них — в блоге Astro.
Node.js 22.8.0 вышла с новыми фичами. Был добавлен новый JS API для компиляции кэша module.enableCompileCache(), появилась возможность создания контекста с замораживаемым globalThis. Появилась интересная экспериментальная возможность контроля покрытия кода тестами: со специальными флагами можно задать процент нескольких видов покрытия, если один из параметров не будет соответствовать порогу, процесс выйдет с кодом 1.
Доступна версия Turborepo 2.1. Напомню, это билд-система от Vercel для JS и TS-кода, написанная на Rust. В этой версии появился флаг affected, который позволяет выполнять команды именно для изменённых модулей и файлов. Были добавлены инструменты для обзора команд и модулей в репозитории, улучшен UI в терминале и доработана система конфигурации для достижения большей гибкости.
Вышло ещё одно критическое обновление безопасности GitLab — аж 17 уязвимостей было обнаружено в этот раз. Одной из них присвоен критический уровень опасности. Она позволяла запускать в CI процессы под другим пользователем, что позволяет получить доступ к репозиториям и закрытым проектам атакуемого. Команда проекта рекомендует обновиться. Подробнее об уязвимостях — в блоге GitLab.
Также в этом выпуске отмечу pnpm 9.10.0, ESLint 9.10.0, Storybook 8.3.0 и Puppeteer 23.3.0.
Другие новости
Стартовал опрос State of HTML 2024.Опрос будет открыт до 1 октября. В прошлом выпуске я уже говорил о важности опросов. Они помогают понимать, какие технологии актуальны, чего не хватает сообществу, и показывают, как развивается индустрия. Ещё это простой способ найти для себя что-то полезное. Результаты этого опроса мы тоже обсудим, как только они будут доступны.