Еженедельный дайджест #51: Новости фронтенда

🧪 HTML и Платформа

MDN подключает документацию напрямую к AI-агентам

Команда MDN представила официальный MDN MCP Server. Он дает редактору или coding agent доступ к свежей документации веб-платформы и таблицам совместимости браузеров. Это снижает риск получить пример с устаревшим API: помощник может проверить факты в MDN прямо во время работы, а не полагаться только на данные своего обучения.

У кастомизируемого <select> текст должен оставаться в <option>

WebKit сформулировал главное правило для нового настраиваемого <select>: не заменять текст вариантов одними иконками или цветными плашками. Видимая подпись помогает понять выбор, доступна вспомогательным технологиям и остается рабочим запасным вариантом в старых браузерах.

В HTML предложили встроенное форматирование времени

В WHATWG обсуждают элемент для локализованного отображения времени. Браузер мог бы сам показывать дату и время в привычном пользователю формате, избавляя простые интерфейсы от отдельного JavaScript и библиотек локализации. Пока это только предложение, поэтому использовать его в продакшене рано.

• В Firefox 152 появилось несколько новых возможностей платформы, включая CSS-свойство field-sizing, которое позволяет полям формы подстраиваться под содержимое; подробности синтаксиса есть в справочнике MDN.
• Экспериментальный Chrome Canary умеет потоково добавлять HTML через textStream(): страница может показывать части ответа по мере поступления, не дожидаясь загрузки целого документа.
• MapKit JS 6 был пересобран как современный пакет для веб-разработчиков: карты Apple теперь можно ставить из npm, а TypeScript-типы доступны через DefinitelyTyped. Возможности API показывает демо с картой Йосемити.

🎨 CSS и дизайн

Область видимости CSS @function отличается от custom properties

Jane Ori разобрала правила вычисления пользовательских CSS-функций. Обычные custom properties наследуются по DOM-дереву, а переменные внутри @function берутся из места вызова. Благодаря этому библиотека может спрятать сложные вычисления за простым интерфейсом, но автору важно учитывать контекст, в котором функция будет вызвана.

Для объемных View Transitions перспективу нужно задавать иначе

В разборе неработающего 3D-перехода объясняется, почему perspective нельзя бездумно повесить на обычного родителя: псевдоэлементы View Transition живут в отдельном дереве. Дополнительный материал показывает устройство всего псевдодерева перехода и помогает выбрать слой, который действительно нужно стилизовать.

Круговую диаграмму можно собрать без JavaScript

Antoine Villepreux предлагает новый вариант CSS-only pie chart. Такая диаграмма подходит для небольших декоративных визуализаций: значения передаются через CSS, а сектора рисуются средствами браузера. Для сложных интерактивных графиков по-прежнему лучше использовать специализированную библиотеку и продумать текстовую альтернативу.

Prop For That передает живые значения из браузера в CSS

Prop For That превращает координаты мыши, текущее время или значение ползунка в CSS custom properties. Достаточно добавить HTML-атрибут, после чего стили могут реагировать на данные без ручных обработчиков в каждом компоненте. На странице с демо можно сразу увидеть, где такой декларативный мост между JavaScript и CSS полезен.

• Обзор современного набора CSS-инструментов показывает, как нативные анимации, маски, переходы и новые единицы измерения помогают делать выразительные страницы с меньшим количеством вспомогательного кода.
• PolyCSS строит текстурированные 3D-модели из DOM-элементов и matrix3d(), без WebGL и <canvas>. Результаты можно изучить в галерее или собрать самостоятельно в визуальном редакторе.
• Storied Colors собирает историю именованных цветов: происхождение пигментов, химические формулы и культурный контекст оттенков.

📦 JavaScript

Babel 8 перешел на ESM и современную версию JavaScript

Babel 8.0 стал первым major-релизом компилятора примерно за восемь лет. Пакеты теперь публикуются только как ESM, TypeScript-типы входят в поставку, а ES5 и CommonJS больше не являются стандартной целью компиляции. Перед обновлением стоит проверить конфигурацию сборки, плагины и код, который все еще загружает Babel через require().

numpy-ts догнал нативную скорость благодаря управлению памятью

Автор рассказал, как ускорил TypeScript-порт NumPy до уровня нативной реализации. Изначально библиотека numpy-ts отставала примерно в 15 раз. Главный выигрыш дала не сама замена JavaScript на WebAssembly, а сокращение копирований и четкое понимание, какая сторона владеет массивом байтов.

Compilecat экспериментирует с глубокой оптимизацией JavaScript

Compilecat - новый экспериментальный компилятор производительности с открытым исходным кодом. Он пробует выполнять оптимизации уровня Closure Compiler, чтобы уменьшать и ускорять программу целиком. Проект ранний, поэтому пока интереснее как лаборатория идей, чем как замена обычному сборщику.

Строгие правила eslint-plugin-unicorn выросли до двухсот проверок

eslint-plugin-unicorn 67 помогает находить сложный или устаревший JavaScript. Среди правил есть проверки качества комментариев, глубины вложенных вызовов, рекомендации использовать Temporal вместо Date и HTTPS вместо HTTP. Включать все сразу необязательно: полезнее постепенно выбрать правила, подходящие проекту.

Zod-схемы можно скомпилировать в быстрые валидаторы

zod-compiler подключается к Vite, webpack и другим сборщикам и превращает знакомые схемы Zod в оптимизированные функции. Исходный API менять не нужно, неиспользуемый код удаляется tree shaking, а авторы заявляют ускорение в 2-75 раз. Это особенно интересно там, где одна схема проверяет много записей.

• Автор htmx рассуждает, почему код становится дешевле, а понимание системы - нет: генераторы упрощают создание строк кода, но не снимают цену сложности. Сам htmx приводится как пример небольшого слоя поверх HTML.
• get-value 4.1 достает вложенное поле объекта по строковому пути вроде a.b.c, а Axios 1.18 усиливает безопасность популярного HTTP-клиента для браузера и Node.js.

⚛️ React и фреймворки

React Router 8 намеренно остается предсказуемым

React Router v8 собирает возможности, появившиеся после v7, и готовит завершение поддержки v6. Команда называет релиз «скучным» в хорошем смысле: React Router остается зрелым выбором для существующих приложений, пока новый Remix 3 экспериментирует с другой архитектурой.

Rust-версия React Compiler вошла в основной репозиторий

Порт React Compiler на Rust объединили с основной веткой. Поддержка уже появляется в Next.js и его canary-сборках, а также в Oxlint, SWC и Rolldown. Компилятор автоматически оптимизирует компоненты, но интеграции пока стоит считать свежими и тщательно проверять.

React Redux проверяет signals для точечных обновлений

В экспериментальном PR появились SignalProvider и useSignalSelector для React Redux. Идея в том, чтобы повторно запускать selector только у компонента, данные которого действительно изменились. Первые замеры показывают выигрыш на больших деревьях, но это пока исследование, а не готовый публичный API.

Wasp теперь описывает full-stack приложение на TypeScript

Фреймворк Wasp отказался от собственного языка конфигурации в пользу TypeScript-спецификации приложения. Разработчик описывает структуру проекта обычным типизированным объектом, а Wasp объединяет его с React, Node.js и Prisma и генерирует full-stack приложение.

Переезд на Next.js App Router сократил медленные ответы на 80%

Команда сервиса объявлений описала миграцию с Pages Router на App Router. Помимо смены роутера пришлось разбираться с потоковой отдачей HTML через Nginx и Akamai. Результат напоминает, что ускорение зависит не только от React-кода, но и от всей цепочки между сервером и браузером.

• Для разработчиков Next.js есть сопоставление его понятий с TanStack Start: маршруты, загрузка данных и серверные функции показаны рядом на примерах кода.
• Разбор переезда сложного состояния с React hooks на Zustand помогает понять момент, когда локальные hooks уже создают слишком много связей между компонентами.
• Обновленный список React-библиотек на 2026 год служит картой инструментов для форм, запросов, состояния, анимаций и тестирования, а не обязательным списком зависимостей.
• WordPress сначала объявил о переходе на React 19, но затем временно откатил обновление из-за несовместимости плагинов.

React Native 0.86 расширяет edge-to-edge и DevTools

React Native 0.86 улучшил полноэкранные интерфейсы на Android 15+ и инструменты разработчика. Expo параллельно открыл бесплатную beta EAS Observe для мониторинга скорости и ошибок мобильных приложений, а авторы Mux объяснили, почему экосистеме нужен новый видеоплеер.

• React Props First поднимает свойства JSX-компонента выше общих DOM- и ARIA-атрибутов в автодополнении VS Code; код расширения доступен в репозитории.
• Base UI 1.6 обновил набор компонентов без готовых стилей, на котором теперь строится shadcn/ui. В каталоге есть примеры всех компонентов, новое поле одноразового пароля и улучшенный Drawer.
• React Doctor оценивает проект по шкале до 100 и находит распространенные проблемы, а инструкция показывает, как запустить автоматическую проверку в GitHub Actions.
• История изменения интерфейса Kindle через патч Hermes bytecode показывает, как исследовать уже собранное React Native-приложение. Отдельно можно познакомиться с самим движком Hermes.

🛰️ Сборка и фреймворки

Крупные веб-фреймворки одновременно готовят новые версии

Сразу несколько проектов дошли до предварительных релизов: SvelteKit 3, Vue 3.6, Vite 8.1 и Astro 7. Beta и prerelease нужны для проверки совместимости плагинов и миграций, но обновлять продакшен без отдельного тестового окружения пока не стоит.

• История HTML-first сайта, удвоившего число пользователей после отказа от React в пользу Astro, показывает ценность простых серверных страниц и надежных форм.
• Практический материал объясняет, как построить в Astro полноценный блог с анонсами, датами обновления и другими деталями, которых обычно нет в учебном демо.
• Svelte Animations предлагает больше 50 компонентов и эффектов на Svelte, Motion и Tailwind; готовые варианты можно открыть в интерактивной галерее.

📘 TypeScript

TypeScript 7.0 дошел до release candidate

TypeScript 7.0 RC позволяет заранее проверить будущий major-релиз компилятора на реальном проекте. Статус RC означает, что основная форма релиза уже определена, но для продакшена все равно разумно дождаться стабильной версии и проверить сторонние инструменты.

TanStack сократил работу проверки типов до 86%

Команда TanStack подробно разобрала оптимизацию типов TanStack Table v9. После модульной переработки гибкие generic-типы начали заметно тормозить редактор. С помощью диагностики tsc команда уменьшила объем type-checking на 62-86%; сама Table v9 уже доступна в beta.

Flow в 2026 году стал ближе к TypeScript, но сохранил строгие правила

Материал сравнивает современный Flow с TypeScript. Типизированный диалект Meta Flow теперь похож по синтаксису, но по умолчанию запрещает некоторые потенциально опасные конструкции, которые TypeScript допускает даже в strict, и предлагает собственные возможности вроде исчерпывающего match.

⚙️ Node.js

Node.js закрыл одиннадцать уязвимостей в трех поддерживаемых ветках

Вышли исправления безопасности для Node.js 26.3.1 Current, 24.17.0 LTS и 22.23.0 LTS. Всего релиз закрывает одиннадцать проблем, включая две высокой серьезности: ошибку проверки имени хоста в TLS и уязвимость WebCrypto. В комплект также вошел Undici 8.5 с собственными security fixes.

npm 12 перестанет автоматически запускать install scripts

Будущий npm 12 будет блокировать preinstall, install и postinstall, пока пакет не разрешен явно. В npm 11.16 уже можно увидеть предупреждения о скриптах, которые перестанут работать. Сравнение показывает, как allow-list устроен в других менеджерах и экосистемах, и помогает заранее подготовить зависимости.

Nub дополняет Node.js возможностями современных рантаймов

Nub от создателя Zod не пытается заменить Node.js, а добавляет более полную поддержку TypeScript, ускоренную и более защищенную установку пакетов и удобную работу с .env. Проект предлагает сохранить знакомый рантайм и package manager, но закрыть часть удобств, ради которых команды смотрят на Bun или Deno.

Поддельное тестовое задание оказалось бэкдором

Разработчик получил от фальшивого рекрутера Node.js-проект с вредоносной зависимостью. Злоумышленники использовали настоящие имена непричастных людей и правдоподобный Git-репозиторий. История полезна как практическое правило: чужое тестовое задание безопаснее сначала читать в изолированной среде, не выполняя npm install и неизвестные скрипты на рабочем компьютере.

Neon сделал аналог psql целиком на TypeScript

Neon рассказал, как собрал Postgres-клиент без бинарного psql для своей Node.js CLI. Команда сочетала генерацию кода с AI, тесты на совместимость и отдельную проверку безопасности. Важная часть истории - не сам язык, а строгий набор эталонных тестов, который не дает новой реализации незаметно расходиться с привычным клиентом.

• Новый GitHub Action одновременно настраивает pnpm и выбранный JavaScript-рантайм: Node.js, Deno или Bun.
• В Cloudflare Workers можно программно зафиксировать версии Node.js и pnpm, а отдельное объяснение разбирает, почему pnpm больше не раскрывает переменные окружения в .npmrc.
• Iroh 1.0 строит зашифрованные peer-to-peer соединения через NAT и firewall. Ядро написано на Rust, но есть официальные биндинги для Node.js.
• Nodemailer 9 теперь по умолчанию проверяет TLS-соединения при загрузке удаленного содержимого писем.
• Node Telegram Bot API 1.1 переписан на TypeScript, перешел только на ESM и поддерживает Telegram Bot API 10.1.
• Объяснение Git worktrees показывает, как держать несколько рабочих деревьев одного репозитория. Это особенно удобно, когда разработчик или несколько агентов параллельно работают над независимыми ветками.

🧬 WebAssembly

WASI 0.3 добавляет нативную асинхронность компонентам WebAssembly

WASI 0.3 позволяет WebAssembly-компонентам описывать асинхронные операции без самодельных обходных путей. Это важно для сетевых запросов, файлового ввода-вывода и долгих задач: компонент может ждать результат, не блокируя остальную программу.

• Энтузиаст оживил старый USB-сканер через WASM-эмулятор в браузере, связав виртуальную старую систему с физическим устройством через WebUSB. Ранее тот же подход помог ему запустить старый принтер.

🤖 ИИ

Улучшения веба для AI должны помогать и людям

Jason Grigsby разбирает спор вокруг специальных веб-API для агентов. Safari уже выступил против WebMCP в текущем виде. Автор предлагает сначала улучшать семантику, доступность и структуру страниц: тогда интерфейс станет понятнее и человеку, и автоматическому помощнику.

TanStack AI вышел в beta

TanStack AI Beta предлагает общий слой для AI-функций без жесткой привязки к UI-фреймворку или провайдеру модели. Это позволяет менять модель или использовать один потоковый интерфейс в разных приложениях, не переписывая всю интеграцию.

⚒️ Инструменты и библиотеки

Playwright 1.61 научился тестировать passkeys и хранилище браузера

Playwright 1.61 позволяет регистрировать и проверять passkeys в end-to-end тестах. Новый WebStorage API дает прямой доступ к localStorage и sessionStorage, поэтому состояние теста можно подготовить без лишнего кода внутри страницы.

Billboard.js 4 получил Canvas-рендеринг для больших данных

Billboard.js 4 сохранил SVG по умолчанию, но добавил опциональный Canvas-режим, уменьшил bundle и ускорил большие наборы данных. В каталоге примеров есть кольцевые, воронкообразные, перекрывающиеся столбчатые и радарные диаграммы.

Mitos превращает изображения в программируемую ASCII-графику

Mitos ASCII Tool конвертирует картинки в текстовую графику и позволяет кодом добавлять эффекты для анимированных hero-блоков. Инструмент используется в визуальном стиле Oxide, а реализацию можно изучить в репозитории Mitos.

Templatical дает встроить drag-and-drop редактор писем

Templatical - open source SDK для визуальной сборки email-шаблонов. Он поддерживает собственные блоки с данными из API, merge tags и темы на design tokens; реальные сценарии есть в playground, а код открыт в репозитории.

Обновления

• ESLint 10.5 точнее подсвечивает проблемные фрагменты в пяти основных правилах, чтобы одно предупреждение не перекрывало другое.
• Biome 2.5 преодолел отметку в 500 правил линтинга.
• Tabulator 6.5 строит интерактивные таблицы из HTML, массивов JavaScript или JSON.
• <relative-time> 5.2 автоматически выводит локализованные абсолютные и относительные отметки времени.
• Fable 5.2 компилирует F# в JavaScript и TypeScript, а теперь еще и в Erlang; изменения собраны в описании релиза.
• XO 3.0 предлагает строгую ESLint-конфигурацию без ручной настройки.
• node-gyp 13 обновил кроссплатформенную сборку нативных модулей для Node.js.
• GraphQL.js 17 выпустил новую версию эталонной JavaScript-реализации GraphQL.
• Faker 10.5 обновил генератор реалистичных тестовых данных.
• Nx 23 развивает сборку TypeScript- и многоязычных монорепозиториев, а BSON Parser 7.3 обновляет работу с форматом BSON.
• React Flow Smart Edge 4.9 прокладывает связи алгоритмом A*, чтобы они не пересекали узлы обычного React Flow.
• Ink 7.1 добавил suspendTerminal(), временно передающий терминал дочернему процессу, например редактору.
• Voltra 2 помогает делать Live Activities и виджеты для iOS и Android на React Native; новая версия больше не требует Expo Modules.
• StyleX 0.19 получил пакет для inline atomic styles и совместимость с ESLint 10.
• MUI X 9.6 улучшил radial bar charts, react-plotly.js 4 обновил React-обертку над Plotly, visx 4 - низкоуровневые React-примитивы визуализации, а React Aria 1.19 - доступные компоненты Adobe.
• Образовательная платформа Frontend Masters переименовалась в Master.dev, поскольку ее курсы давно вышли за рамки одной фронтенд-разработки.