JavaScript *

Почти три года я в одиночку строил бэкенд-фреймворк поверх Next.js App Router. По дороге мой ишью закрыл создатель C#, синтаксис подсказал Copilot, а три пакета-адаптера пришлось убить. Рассказываю, что вышло и какие грабли собрал.

Привет!

Это девятый выпуск Frontend Status — дайджеста по фронтенд-разработке.

В этом выпуске:

📺 Разговор с Машей Кондрашиной из Авито о том, что в IT больше не спорят из-за технологий.

🤖 VS Code переходит на еженедельные релизы благодаря AI-агентам, Chrome объясняет разницу между MCP и WebMCP, а Эдди Османи вводит термин «comprehension debt».

⚛️ React получает shadcn/cli v4 с режимом для агентов, SvelteKit ловит FOWL, Astro v6 подтягивает данные из API прямо в content collections.

🌎 Chrome 146, Mozilla за анонимность в вебе.

🎨 Брэд Фрост о дизайне в эпоху AI.

📦 Эмпирическое исследование утечек памяти на 500 репозиториях.

...и многое другое.

В данной статье рассматриваются примечательные ошибки при работе с Kafka, в том числе при использовании библиотеки KafkaJS, а также способы их устранения и методы увеличения производительности при публикации и обработки сообщений.

Предполагается, что читатель имеет базовое представление о Kafka (раздел "Общие термины" поможет освежить информацию) и функционале библиотеки KafkaJS.

В первой части разбираются аспекты, связанные с публикацией сообщений.

Идея этого проекта родилась у меня после двух событий.

Первое случилось в самолёте. Мне было нечем заняться, и я решил посмотреть фантастический фильм «Она» (Her, 2013). Я человек впечатлительный, и если в истории есть драма, то легко начинаю сопереживать героям. Фильм рассказывает об одиноком мужчине, который устанавливает ИИ‑операционную систему, начинает с ней общаться и постепенно влюбляется в неё. Спойлерить не буду - фильм действительно стоит посмотреть.

Второе событие - это хайп вокруг OpenClaw. Я как раз вернулся домой, занялся своей обычной работой и в свободное время решил изучить, что это такое. К тому моменту вокруг проекта уже было много шума, и он успел набрать около 300 тысяч звёзд на GitHub.

Меня это действительно впечатлило. Ощущение было почти как в фильме про Железного человека: ты запускаешь ИИ, и он, как Джарвис, выполняет задачи и отвечает тебе почти как живой собеседник. Но довольно быстро стало понятно, что у такого подхода есть две серьёзные сложности.

Первая - нужно хотя бы в общих чертах понять, как внутри устроен OpenClaw: что такое ноды, каналы, связи между компонентами и прочие технические сущности.

Вторая - всё настраивается через пошаговый текстовый визард в терминале. Такой подход скорее рассчитан на технически подготовленного пользователя или ИИ‑специалиста, а не на обычного человека.

Неудивительно, что сегодня многие компании либо предлагают уже преднастроенный OpenClaw у себя в облаке, либо продают услуги по его установке и настройке под конкретные задачи.

Недавно, когда писал статью про «Тетрис», я поймал себя на мысли, что вспоминаю не только падающие блоки, но и другой культовый проект — жёлтый кругляш, вечно убегающий от призраков. А потом в памяти всплыл фильм «Пиксели» (2015). Там есть сцена, которая одновременно смешная — жутковатая: создатель Пакмана, Тору Иватани, выходит к гигантскому Пакмену и пытается с ним поговорить по-отечески: 

«Пакман, я сделал тебя. Ты такой голодный, я знаю. Не надо больше есть. Хороший мальчик» — актёр Денис Акияма (Тору Иватани).

И вот я подумал: а почему бы не попробовать самому создать Пакмена? Не такого кровожадного, конечно, а просто для души. Тем более что с «Тетрисом» получилось удачно, захотелось закрепить успех.

Всем привет! Меня зовут Саша. Я тимлид команды разработки личного кабинета пользователя в Банки.ру.

В какой-то момент я понял, что мы тратим слишком много времени на однотипные изменения в коде: обновления зависимостей, правки после breaking changes, синхронизация между проектами. Всё это делается через поиск, регулярки и ручное редактирование и быстро начинает масштабироваться в боль.

В статье разобрал, как можно подойти к этому иначе: использовать codemod и jscodeshift, чтобы автоматизировать такие изменения и применять их сразу ко всей кодовой базе. Как это работает через AST, и посмотрим на примере, как писать свои трансформации.

В 2025 году JavaScript исполнилось 30 лет — хороший повод попытаться объять необъятное разобраться, как он меняется и в каком направлении развивается. За три десятилетия язык переживал периоды скепсиса и бурного роста, обрастал экосистемой и стандартами, и в итоге вышел далеко за пределы браузера, охватив серверную и кросс‑платформенную разработку.

Всем привет! Меня зовут Владимир, я разработчик СберБанк Онлайн в канале «веб», и в этой статье я хотел бы затронуть этапы эволюции JavaScript, зафиксировать нововведения спецификации ECMAScript 2025, разобрать наиболее значимые предложения для будущих версий стандарта и попытаться понять его место в эпоху стремительного развития ИИ.

Случайно увидел результат работы функции RegExp.escape() и был удивлен, потому что она заэкранировала пробелы, все спецсимволы, а также цифры и латинские буквы в начале строки. До появления RegExp.escape() (а она стала доступна в популярных браузерах лишь в 2025 году) я, как и многие другие, писал аналогичную функцию сам, но без экранировки вышеперечисленных символов. Получается, что я ошибался, и нужно бросать все дела, рыться в старых исходниках и переписывать функцию? И да, и нет.

JavaScript выполняет код в одном основном потоке. Это означает, что инструкции выполняются последовательно — одна за другой. Получил команду — выполнил. Но что делать интерпретатору, если он встречает код, который не может выполнить сразу? Например, обработчик события. Пока событие, допустим, клик на кнопку, не произошло, код внутри обработчика не выполнится. Такой код называют асинхронным. К асинхронным операциям относятся, например, таймеры (setTimeout), сетевые запросы или события интерфейса. Промисы (Promise) используются для обработки результатов таких операций. В такой ситуации на помощь интерпретатору JS приходит среда, в которой выполняется скрипт. Это может быть Node.js, мобильные среды или интерфейс, который предоставляет браузер — Web API (есть и другие). В отличие от JavaScript-движка, среда выполнения может использовать несколько потоков для обработки ввода-вывода, таймеров и сетевых операций.

Если сравнить выполнение скрипта с выступлением оркестра, то дирижёром, который отвечает, чтобы каждая функция «отыграла свою партию» в нужный момент, можно назвать Event Loop. Event Loop — это механизм среды выполнения, который управляет порядком выполнения задач. Он координирует работу JavaScript-кода, обработку событий и другие процессы браузера. Вопреки расхожему мнению, работа этого механизма не так сложна, как его часто описывают. В этой статье, проповедуя Фреймановскую истину — «Если не можешь объяснить что-то простыми словами, то ты не понимаешь этого» — автор попытается (для себя и для других) описать работу Event Loop в браузере. В среде Node.js концепция похожа, но вместо Web API используются другие механизмы ввода-вывода.

1. Скинули в ИИ текст ошибки.
2. Получили поверхностный ответ.
3. Закрыли вкладку.

«Этот ваш ИИ – глупый какой-то!»

Помните, как пару лет назад мы восхищались тем, что нейросеть может написать связный абзац? А год назад – что она осилила код без синтаксической ошибки? Сегодня планка взлетела так высоко, что уникальные способности моделей превращаются в стандартный пакет услуг.

OpenAI выкатила GPT‑5.4 Pro. И если раньше слово “Pro” в названии часто означало просто “чуть больше токенов и подороже”, то теперь это действительно профессорский уровень. Модель берёт сложнейший тест ARC-AGI-2 с результатом 83,3% (против 54% у предшественницы), решает задачи из FrontierMath, которые ещё недавно казались крепостью для ИИ, и... случайно находит в интернете забытую научную статью 2011 года, чтобы срезать путь к ответу.

В этом обзоре мы не только разбираем цифры бенчмарков (хотя они тут просто фантастические), но и устраиваем моделям настоящую проверку: от логической головоломки с серверами до полноценного стелс-симулятора на канвасе.

Пристегнитесь, будет интересно!

Если вы ранее работали с мобильным приложением DogPlanner, то вы, наверное, уже знакомы с робопёсом Роби. Но в любом случае, позвольте рассказать вам его историю. Роби живёт на Марсе... ходит молва, что он был собран кем-то из деталей первого в истории марсохода Sojourner. Он изучает красную планету, да и, по возможности, всю вселенную через сигналы, приходящие из космоса.

Как меняется JavaScript?

JavaScript уникален тем, что работает во всех браузерах. У него нет какого-то одного «владельца», поэтому нельзя внести изолированное изменение и ждать, что оно будет применено везде. Эволюция происходит через TC39 — Технический комитет, отвечающий за ECMAScript.

Предложения должны пройти последовательность этапов развития:

• Этап 0: идея.

• Этап 1: принято пространство задач.

• Этап 2: выбрана архитектура драфта, но работа продолжится.

• Этап 2.7: предложение одобрено в принципе; ожидает тестирования и обратной связи.

• Этап 3: реализация и обратная связь.

• Этап 4: предложение стандартизовано.

В 2018 году, когда я впервые изучал Temporal, он находился на Этапе 1. Комитет TC39 был убеждён, что проблема реальна. Это было радикальное предложение по добавлению в JavaScript новой библиотеки дат и времени. Она должна была:

• Стать заменой Date.

• Добавить новые типы DateTime (вместо единого API).

• Стать неизменяемой.

• Добавить поддержку часовых поясов и календаря.

Но как мы к этому пришли? Почему Date вызывает столько проблем? Чтобы ответить на эти вопросы, нужно вернуться назад.

Чувак, уже есть Pinia, Pinia Colada, TanStack Query для Vue, зачем ещё один способ управлять состоянием во Vue?

Меня просто задолбало писать везде флаги отслеживания состояния для действий и делать store через фабричную функцию, как это делали наши праотцы в начале 2000-х. Запоминать зоопарк из разных composable-функций и хуков. Изучать какую-то другую систему реактивности, типа MobX, тоже не хочу. Это какой-то зашквар.

Я хочу использовать то, что есть: реактивность Vue везде, классы, методы. Хочу использовать классические шаблоны: SOLID, DDD и т.п. Хочу, чтобы Действие или запрос сами отслеживали и сообщали своё состояние. Хочу сконцентрироваться на бизнес-логике и писать меньше шаблонного кода.

И это возможно, покажу, как это работает на примере.

Java называют языком программирования. С формальной точки зрения это может быть и так. На практике картина более широкая: я считаю, что Java нужно рассматривать как целую программную систему для гибкой (Agile) разработки. В ней можно выделить четыре ключевых подсистемы, которые вместе образуют Java платформу:

1. Система ведения онтологии и моделирования бизнеса
2. Система верификации типов с правилами подстановки
3. Система среды исполнения динамического кода
4. Система модульной эволюции кодовой базы

Пост утверждает, что настоящей гибкости, требуемой для реально модульных программ, поддающихся эволюции, так нужной энтерпрайзам, в Java практически нет; вместо неё царит хаос и тотальное смешение понятий на поле боя, где онтология, проектировка, реализация, рантайм да и сам разработчик ведут борьбу каждый за свои собственные принципы, в то время как главной жертвой является модульность.

Для доказательства возьму конкретную тему совместимостей библиотек. Этот вопрос с технической стороны хорошо изучен, и разделяют три вида совместимостей: исходную, бинарную и поведенческую. Но будет полезным привести примеры еще раз, разбив не просто по этим трём категориям, а по зонам ответственности, для того, чтобы понять, какие трения возникают между самими подсистемы Явы.

После обширного анализа будет представлено видение направления развития Явы как платформы, получившей новую среду скриптовых языков GraalVM. Основным тезисом служит заявление, что Агиль методология требует строгой трактовки, дисциплины и продуманных инструментов, чтобы свобода разработчика не превратилась в её свободный полёт в пучину хаоса.

Если спросить разработчика, что такое dataLayer, чаще всего ответ будет примерно такой: «Ну это что-то из GTM». Я понимаю, что вот вы, конкретно вы, уважаемый читатель, так не отвечаете, и никто так не отвечает, но у меня вот такая статистика. А если спросить аналитика, что нужно для настройки событий, ответ будет: «Нужно просто пушнуть это в dataLayer» Здесь начинается легкое раздражение с обеих сторон. Разработчику кажется, что это часть Google Tag Manager, которую он не обязан понимать. Аналитику кажется, что это очевидная вещь уровня «объявить переменную». В итоге dataLayer превращается в некий черный ящик, за который отвечает «кто-то другой».

Спойлер: никто.

Главная мысль этой статьи простая: dataLayer — это просто глобальная переменная в window. Все остальное — это уже работа разработчика по задачам аналитика и последующий тюнинг аналитиком в тег-менеджере.

28 февраля 2026 года я стоял у окна на 41-м этаже в JBR в Дубае и смотрел, как системы ПВО ОАЭ перехватывают иранские беспилотники прямо над моей головой. Полез в новости — в Google и Яндексе статья двухчасовой давности, Telegram-каналы противоречат друг другу. Когда это происходит где-то далеко, не придаёшь этому значения. Когда ты в центре событий, то хочешь знать оперативную информацию, желательно с push-уведомлениями.

Часто использую ChatGPT и другие нейросети для работы: обсуждаю идеи, пишу код, прошу объяснить сложные темы. В итоге в чате накапливаются сотни сообщений. И тут начинается хаос:

Нужно найти функцию, которую обсуждали утром? 5 минут скролла вверх в поисках нужного места — и я уже потерял нить разговора. Приходится начинать заново.

Отдельная боль — потеря контекста моделью. Пишешь код, а модель внезапно «забывает» техническое задание из начала диалога. ChatGPT просто обрезает контекст, а понимаешь это только спустя 10 минут потраченного времени.

В голове крутилась идея, как это исправить. Минутный поиск готовых решений не дал, поэтому сделал собственное расширение.

Я не OpenSource разработчик, но за пару десятков лет написал под сотню enterprise-level библиотек, которые остаются в рабочем контуре, дорабатываются под каждый проект и адаптируются к новым технологиям. Большого смысла выходить в OSS не было, кроме как для упрощения обучения коллег и единого места хранения документации.

Но и желание помогать другим и делиться выстраданными подходами, экспертизой и конкретным кодом мне не чуждо - сегодня поможешь ты, завтра - тебе. Через полгода подготовки и адаптации к OpenSource (сам использую и дорабатываю около 8 лет) в свет выходит одна из библиотек моего рабочего контура - Reactive Route.

Так как я работаю с проектами на разных стеках, стараюсь писать код максимально framework-agnostic - независимыми слоями, которые можно заменить или переписать, не трогая остальной код проекта. А к фреймворкам и библиотекам для работы с состоянием они подключаются с помощью легковесных адаптеров, сохраняя синтаксис работы. Конкретно для Reactive Route выложил набор готовых адаптеров в комбинациях, которые сейчас чаще всего использую:

• React + MobX / Observable

• Preact (no compat) + MobX / Observable

• Solid.js + нативная реактивность / MobX / Observable

• Vue + нативная реактивность

В одном npm-пакете - строгая TS-типизация, SSR / MPA / no-JS / Widget режимы и тщательно протестированная отказоустойчивость. В статье не буду пересказывать документацию на русском и английском, а поговорю скорее про общие принципы качества, использование ИИ в разработке и почему многие библиотеки раздуваются, не успев даже стабилизировать ядро.

На днях, я опубликовал новость о выходе новой версии UI-библиотеки Symbiote.js, с обзором ее функций и необычной концепции. Я давно пишу на Хабре (и не только) о веб-компонентах и решениях на их основе, и знаю полный набор стандартных сомнений и возражений аудитории.

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