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

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

Прогрессивный рендеринг изображений: что умеем сегодня

Джейк Арчибальд проверяет, насколько «прогрессивная» загрузка полезна в 2025: сравнение AVIF, JPEG XL и других форматов, поведение в браузерах и на разных сетях, живые демо. Полезно, чтобы понимать, что именно даёт прогрессивность и когда её применять.

Web MIDI + Web Audio: сила веба в действии

В видео-докладе «Web MIDI, Web Audio, and What the Web Does Best» показывают, как связать Web MIDI, Web Audio API и другие инструменты, чтобы в браузере «сыграть» Daft Punk — Around the World. Отличный пример, как веб-платформа подходит не только для форм и списков, но и для музыки.

• «Page Headings Don’t Belong in the Header» — напоминание по семантике: заголовки страницы лучше располагать вне header, чтобы не путать структуру документа.
• HTML5 стал рекомендацией W3C 11 лет назад — немного истории стандарта.
• Что нового в Chrome 142 — в том числе псевдоклассы :target-before и :target-after.

• Есть ли API для HTML-таблиц? Да! Кристиан Хейльман объясняет, что именно скрывается под капотом и как этим пользоваться: «Did You Know That There’s an HTML Tables API?».

🎨 CSS и дизайн

Пружины и «отскоки» на чистом CSS

Как сымитировать «пружину» в анимациях с помощью функции времени linear()? Джош рассказывает про подход с «набором готовых кривых» в глобальных CSS-переменных, показывает демо и объясняет, почему сейчас это самый практичный способ. Отличный материал, если вы хотите получить «живые» анимации без JS. Подробнее см. в статье «Springs and Bounces in Native CSS».

Современный CSS решает задачу «секционного» лейаута

Ахад Шадид разбирает типовой макет секции и делает его гибким за счёт clamp(), style queries, псевдокласса :has() и других новинок. Пошагово и с иллюстрациями — удобно для начинающих. Читать: «Solved By Modern CSS: Section Layout».

• «The CSS Reset, Again» — обзор популярных CSS-reset’ов: что берут, а что спорно, и зачем вообще ресеты в 2025.
• «For Your Convenience, This CSS Will Self-Destruct» — приём производительности: показываем элемент через анимацию keyframes, если JS по каким-то причинам не отработал.
• «CSS Animations That Leverage the Parent-Child Relationship» — как анимировать с оглядкой на иерархию родитель/потомок.
• «Inlining Critical CSS: Does It Make Your Website Faster?» — стоит ли инлайнить критический CSS, и когда это реально ускоряет загрузку.
• Отладка @starting-style в Chrome DevTools — теперь проще понять стартовые состояния для переходов.

📦 JavaScript

• История JavaScript (видео) — 25 минут о том, как зарождался язык и как мы пришли к «инструментальному» современному вебу: «The Origin Story of JavaScript».
• Почему NaN !== NaN — короткий разбор IEEE 754 и «странностей» чисел в JS: прочитать разбор. -Переосмысление асинхронных циклов в JS — почему await в циклах и map() часто ведёт не туда, как писать понятнее и быстрее.

TypeScript

TypeScript стал №1 по использованию на GitHub

Отчёт GitHub Universe: «TypeScript Leaps to #1 Most Used Language on GitHub». Год назад лидерство было у Python, а теперь корону забрал TypeScript. GitHub связывает это и с ростом LLM-ориентированной разработки. Если учитывать JavaScript+TypeScript вместе, фронтенд-экосистема остаётся далеко впереди.

• «Пишем как в Rust, но в TS» — приёмы и идиомы, которые делают код в TS более «системным»: читать статью.
• Типизированные регексы — обёртка над RegExp, дающая типы для паттернов и групп захвата: ArkRegex (часть ArkType; исходники: GitHub).

⚛️ React

Обзор React Conf 2025

Официальный конспект главной конференции по React: React 19.2, стабильный React Compiler 1.0, «большие» изменения в React Native и подборка важных докладов. Если вы пропустили события октября, этот обзор React Conf 2025 поможет быстро догнать повестку.

• Директивы в React и границы платформы. Тенденция к появлению директив вроде use client, use server, use no memo: чем они полезны и чем грозит «запирание» в инструментах и фреймворках — мнение Таннера Линсли. Прочитать про «Directives and the Platform Boundary».
• Новая директива use no memo. Коротко: помечает функцию так, чтобы React Compiler не оптимизировал её. Детали — в заметке про use no memo и самом Compiler.
• Как починить любой баг. Дан Абрамов показывает, почему ИИ не помог с проблемой в React Router, и объясняет ценность минимального «репро». Полезный разбор процесса с примерами — прочитайте «How to Fix Any Bug».

Next.js 16 вышел

К релизу Next.js Conf вышла 16-я версия: стабильные Turbopack и React Compiler, новые компоненты кеширования, MCP-сервер для ИИ-отладки и другое. Начните с анонса Next.js 16 (тут же ссылка на запись конфы), а затем проверьте Next.js 16.0.1 — свежий патч-релиз.

• Remix Jam и релиз Remix 3. Команда поделилась своим дайджестом мероприятия, где впервые показали Remix 3.

• Год с App Router и почему уходим. Критика RSC и Next.js 15 от Paper Clover: архитектурные компромиссы и опыт в продакшене. Читать «One Year with Next.js App Router…».

• React vs Remix: разные пути. Короткое сравнение направлений — прочитать заметку.

• React и Elm: бок-о-бок. Автор собирает один и тот же апп на двух стеках, чтобы показать различия: архитектура, типы, состояние. Читать сравнение React vs Elm.

• Компонент Activity в React 19. Что это, как использовать и на что обратить внимание — опыт автора. Коротко и по делу — разбор компонента Activity.

• Solito 5.0: единая навигация для RN и Next.js. Поддержка Next.js 16 и Expo 54, отказ от React Native Web как зависимости. Подробнее на странице релиза Solito 5.0 и в документации Solito.

• React + Hermes для нативных GUI. Прототип: React управляет библиотекой Dear ImGui c движком Hermes — альтернативный путь к нативным приложениям. Посмотрите демо-поток идеи и саму Dear ImGui / Hermes.

• Сравнение мобильных подходов. Один и тот же апп сделан десятью способами (включая два на React) — фокус на производительности на мобильных. Разбор — в статье «built the same app ten different times».

⚙️ Node.js

Awesome Node: более 500 отобранных пакетов, ресурсов и ссылок

Большая коллекция для нод-разработчика: готовые инструменты, учебные материалы и полезные ссылки. Отлично, чтобы быстро находить проверенные решения и идеи для своих проектов. Посмотреть список можно здесь — Awesome Node.

Коротко:

• Странность с LTS-веткой Node.js: некоторое время не было «активного» LTS, из-за чего сломалась страница загрузок. Временным решением v24.10.0 отмечена как LTS, при этом «current» уже v25.
• Короткий апдейт от Lizz Parody о состоянии проекта Express: что нового в Express.js.

Что я узнал, перенося Mastro с Deno на Node

Автор портировал фреймворк/генератор сайтов Mastro с Deno на Node и делится подводными камнями: совместимость API, сборка, зависимости и DX. Хороший разбор, если вы думаете о кросс-рантаймах. Прочитать статью: опыт миграции Mastro. Для справки: сам Deno — это альтернативный рантайм к Node.

AdonisJS переосмыслил стартовые наборы

Современный фреймворк Adonis представил новый «стартер-кит» с базовыми UI-компонентами (кнопки, поля, лэйауты) и готовой авторизацией, чтобы быстрее запустить приложение. Подробнее: статья автора.

Vitest 4.0 — тестовый фреймворк на базе Vite

Новая мажорная версия делает «браузерный режим» стабильным (тесты запускаются прямо в браузере), добавляет визуальные регрессионные тесты, поддержку Playwright Traces и прочие улучшения. Подробности: анонс Vitest 4.0. Для выбора раннера можно сравнить с альтернативами. Кстати, Александр Лихтер собрал итоги ViteConf 2025: Vite+, поддержка плагина Oxlint для JS, Nitro v3 и др.

Node.js 24.11 становится LTS

Node.js v24.11.0 (LTS) — релиз переведён в активную LTS-ветку с поддержкой до апреля 2028. Параллельно вышли v22.21.1 LTS и v25.1 Current. Если вы ещё на 22-й — полезно пройтись по заметкам по миграции: «Migrating from Node.js v22 to v24».

• Коротко об Express.js — Лизз Пэроди подготовила апдейт по проекту Express и текущим шагам вперёд.
• Переезд с Deno на Node — опыт портирования генератора сайтов Mastro и где возникают несоответствия: прочитать заметки (о самом проекте: Mastro, про Deno).
• Как я построил auth-систему на 1.9B логинов/мес на Node — видеодоклад с практическими деталями архитектуры.
• Остановят ли новые меры безопасности npm следующий Shai-Hulud? — обзор инициатив npm и общих рекомендаций по цепочке поставок.

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

• Спойлер-эффекты как веб-компонент — лёгкий компонент для скрытия текста до клика (в духе Telegram): spoilerjs.

• emoji-regex — регулярка для всех «эмоджи-символов» и их последовательностей по стандарту Unicode.
• GramIO — фреймворк для телеграм-ботов, работает в Node, Bun и Deno; официальный Bot API, а код здесь: GitHub-репо. Альтернатива для Node — telegraf.js.
• Gasket — CLI для поиска «мостов» между JS и нативным кодом через анализ памяти (см. сопутствующую научную работу).
• workerpool 10.0 — пул воркеров для параллельных задач, работает и в Node, и в браузере.
• TypingSVG — генератор анимированных SVG, имитирующих набор текста (есть поддержка Google Fonts, настройка скорости и «бекспейса»).
• oklch.fyi — one-stop по цветовому пространству OKLCH: объяснения, построитель палитр и градиентов, визуализация охвата и конвертер.
• Helium — маленькая библиотека «как HTMX/Alpine, но проще», чтобы добавлять интерактив почти без JS; есть демо на CodePen.
• DevTUI — «швейцарский нож» для разработчика в виде TUI/CLI: конвертеры, форматтеры, энкодеры — в одном месте.

• Recharts 3.3 — реактовая библиотека графиков на базе D3; теперь графики сами умеют адаптироваться к размеру контейнера. Смотрите релиз и примеры на главной.
• Cornerstone.js 4.8 — набор для медицинских изображений: релиз.
• fuzzy-search 2.0 — быстрая «фаззи»-поисковая библиотека для фронтенда: обновление.
• Immer 10.2 — иммутабельное состояние без боли: релиз.
• Dependency Cruiser 17.2 — визуализация и контроль зависимостей: релиз.
• Ink 6.4 — пишем CLI-приложения на React: релиз.

Браузерные/десктоп-фреймворки и сборка

• Electron 39 — обновления до Chromium 142, V8 14.2 и Node 22.20: релиз-ноты.
• Ember 6.8 — новый API renderComponent, по умолчанию Embroider и Vite для значительно более быстрых сборок: подробности.
• Rspack 1.6, pnpm 10.20, Vite 7.2.0 Beta 1 (changelog), Three.js r181 — подборка свежих версий: обзор ссылок · pnpm · Vite 7.2 beta · Three.js r181.

Обновления

• OpenAI Node 6.7 — официальная библиотека; поддержка схем Zod 4.
• Electron 39.0 — апдейт до Chromium 142.
• vm2 3.10 — песочница для запуска недоверенного кода.
• ESLint Markdown Plugin 7.5 — линтинг JS/TSX в markdown-блоках.
• pnpm 10.19 — быстрый и экономный менеджер пакетов.
• Prisma 6.18 — ORM для Node.js/TS.
• node-soap 1.6 — SOAP-клиент/сервер для Node.
• Hexo 8.1 — генератор блогов.
• node-redis 5.9 — клиент для Redis/Valkey.
• ini 6.0 — парсер/сериализатор INI.
• 📊 Recharts 3.3 — библиотека графиков на базе D3; на главной много демо. Главное в 3.3 — нативная отзывчивость размеров.
• 📅 React Date Picker 8.8 — компонент выбора дат; появились улучшенные доки.
• react-intersection-observer 10.0 — хук, реагирующий на попадание элемента в вьюпорт.
• ReactPivot 6.1 — грид с фичами сводных таблиц; есть демо.
• React Stripe.js 5.3 — компоненты для Stripe.js/Elements.
• Ink 6.4 — пишем CLI-приложения на React.
• Astro 5.15 — минорные улучшения и фиксы.