TypeScript *

Привет!

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

JS/TS: Evan You — Vite, Rust, VoidZero; State of JS 2025 и новый интерфейс npm (npmx).

AI: Transformers.js v4 в NPM; тест «заменит ли ИИ опытного дебаггера».

Фреймворки: React — ViewTransition, SSG-сравнение, календарь DayFlow; Angular — обзор v22 и демо проект на Genkit.

CSS и браузеры: гистограммы и подсветка поиска без JS; предпочтения размера шрифта из системы в Chrome.

Доступность и интерфейсы: когнитивная доступность (W3C), combobox vs multiselect, якоря и UX.

Разное: ограничения и вдохновение, «искусство неправильного взаимодействия», репортаж с t-sync.

Сервис‑воркеры сегодня — не экзотика, а рабочий инструмент: offline‑режим, агрессивное кэширование, «живые» обновления и всё такое. Под это уже давно есть отличный, проверенный Workbox, и я сам с ним работал.

Но по мере того, как я таскал SW из проекта в проект, у меня всё чаще возникало ощущение, что мне нужен инструмент с другим профилем: поменьше магии и слоёв абстракции, попроще вход в код и в «как тут всё устроено», конструктор из маленьких плагинов, которые легко прочитать глазами и отладить.

Поэтому я написал @budarin/pluggable-serviceworker — не вместо Workbox, а как более лёгкий, типизированный и прозрачный рантайм для тех случаев, когда хочется полной управляемости и минимально возможной когнитивной нагрузки.

Привет, Хабр! Меня зовут Сергей, я фронтенд-инженер в Банки.ру.

В этой статье расскажу, как Zod помог нам перестать писать валидацию на уровне полей, подружился с React Hook Form и стал единым источником правды о структуре данных.

К Zod мы пришли не сразу. Долгое время типы и валидация у нас жили в разных слоях приложения: TypeScript определял структуру данных во время разработки, а отдельные функции или библиотеки (вроде Yup) проверяли входящие значения в рантайме.

Это классическая проблема: дублирование логики и рассинхрон. Типы в interface поменялись, а валидация осталась прежней (или наоборот). Мы пробовали Yup, но он казался громоздким в связке с TS: типы приходилось выводить вручную или мириться с тем, что схемы выглядят непрозрачно. В какой-то момент стало непонятно: зачем тащить отдельную библиотеку, если проще написать if (typeof x === 'string')?

С переходом на Zod всё стало значительно проще: одна схема одновременно является и валидатором, и источником типа данных.

В прошлой статье "Ваш отчет никто не читает: Как мы научили разработчиков понимать падения тестов за 30 секунд?" мы разбирали, как слой Flows и декораторы позволяют разрабам не тратить время на дебаг отчетов. Статья вызвала большой отклик, и сегодня я хочу раскрыть «фундамент», на котором строится этот подход.

Многие годы нам продают BDD (Behavior-Driven Development) как "серебряную пулю" для коммуникации...

Давайте честно, это чушь. Никогда не понимал, зачем мы кормим этого монстра по имени Cucumber. Тратим до 50% времени на поддержку регулярок («клея»), возимся с хрупкими .feature файлами и боимся переименовать шаг, потому что все развалится. При этом ни один менеджер в здравом уме не заходит в ваш репозиторий читать эти файлы. Они все смотрят только отчеты.

Так зачем нам Gherkin на этапе написания кода? Представляю вам новую методологию BDR (Business-Driven Reporting).

Почему классический BDD (Gherkin) — это ошибка?

Gherkin заставляет инженера работать внутри IDE, как в текстовом блокноте. Это абсурд.

📉🐻 Как ИИ получил руки для торговли на бирже

Claude Code уже разбирается в техническом анализе, умеет искать в интернете для фундаментального, может быть запущен удаленно на сервере с iPad через Claude Code on the web, умеет анализировать файлы логов сам программируя python скрипты.

Осталось ли собрать всё это в кучу...

Встав утром и посмотрев в профиль, отметил: на Хабре много лет, писал статьи, писал код. И ни разу не писал о коде на Хабре. А вообще‑то разработчик. Поззорище! Пора исправляться.

Поговорим о классической (и болезненной) проблеме кодирования «присваивание вместо равенства» которая в любой момент может создать очень много проблем. О логическом источнике этой ошибке, и о способах решения.

Ну и ещё слегка вспомним «Звездные войны»:-)

У нас случилась классика: бэкенд уже отдает данные, бизнес ждет экран «вчера», а фронтендера в команде нет и ближайшие фронты заняты.

Мы рискнули и собрали MVP‑интерфейс за неделю — без выделенного фронта, но на корпоративном стеке (Vue/TypeScript) и с дизайн‑системой.

Это не история «AI все сделал». Это история про то, как правила + дизайн‑система + ревью как для джуна могут делать из AI‑ассистента нормальный инструмент, а не генератор мусора.

В версии 1.58.0 библиотеки prisma-sql появился метод $batch, который позволяет выполнять несколько Prisma-запросов за один раунд-трип к базе данных.

Зачем вообще компилировать TypeScript?

Есть большой проект, с кодовой базой в два миллиона строк на C++. Ядро на плюсах, поверх него работают несколько UI: десктопный интерфейс, веб и мобильное приложение. В какой-то момент проект упирается сразу в две проблемы. Первая — лицензионные ограничения: новые версии Qt, на которых мог бы жить десктопный интерфейс, становятся недоступны по санкционным причинам. Вторая — скорость разработки: UI давно хотелось писать быстрее.

Возникает логичный вопрос: что, если взять лучшие, максимально автоматизированные инструменты из веба и перенести их в мир нативных приложений без браузера и лишних прослоек? Ключевая цель — обеспечить возможность вызова C++-код из TypeScript с возвратом результата без промежуточных интерпретаторов.

Меня зовут Владимир Цышнатий @Tsyshnatiy. Я занимаюсь разработкой более 15 лет, мой основной профиль — C++. Помимо этого меня увлекают технологии на стыке разных миров. В том числе идея, лежащая в основе этой статьи: дать возможность писать на TS как на нативном языке.

Интересно узнать, как мы это делали и что получилось? Детали под катом! 

Привет!

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

В этом выпуске — 30+ ссылок: разбираем, почему Angular живёт в банках и корпорациях, AGENTS.md vs skills в Next.js. Плюс CSS, который заменяет десятки строк JS, React Compiler от А до Я, Vue-слоты и Regle, вайбкодинг-исповедь «я сдался», WebGL-галерея на GSAP + Three.js, и ещё много всего интересного!

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

Я открываю старый проект 2020 года и вижу знакомые имена в package.json: create-react-app, enzyme, moment.js, axios. Пять лет назад это был золотой стандарт. Сегодня же эти технологии вызывают у коллег искреннее недоумение: «Зачем это тут?»

А ведь прошло всего пять лет.

И за эти 5 лет изменилось очень многое: SPA переживает упадок, TypeScript стал обязательным стандартом, роль фронтенд-разработчика расширяется до full-stack. А дальше что, браузеры заменят фреймворки?

Привет! Это второй выпуск Frontend Status — дайджеста по фронтенд-разработке. В выпуске — два десятка материалов: от коротких демо до гайдов и спецификаций.

В подборке — то, чем живёт фронт прямо сейчас: свежий CSS, AI-инструменты (генеративный UI, офлайн-поиск по сайтам, Figma → React), записи (Remotion, ИИ и верстка), апдейты браузеров и платформ (geolocation, Grid Lanes, WebNN, угрозы и учётные данные). Плюс React и Angular, WASM-язык COI, Temporal API и обход блокировок Cursor/Claude через OpenCode.

В начале XVI века была издана книга английского юриста и философа Томаса Мора под названием "Утопия", в которой описывалась идеальная по мнению автора структура общества. Название этой книги стало именем нарицательным и дало имя всему жанру подобных трактатов. Книга Мора была далеко не первой: ещё за две тысячи лет до её выхода в свет древнегреческий философ Платон опубликовал трактат "Государство", в котором излагал свои взгляды на общественное устройство. Кто только не создавал своих утопий: например, Карл Маркс с его манифестом коммунизма и диктатурой пролетариата или Карл Поппер с его "Открытым обществом и его врагами". Почему бы не сделать этого и мне?

Китайский философ-даос Лао-Цзы писал, что когда нечто доходит до предела, оно обращается в свою полную противоположность. Из истории нам известно, что любые попытки воплощения различных утопий в жизнь всегда заканчиваются их полной противоположностью - тоталитарными антиутопиями. Поэтому в этом эссе я планирую описать не утопию, которая практически невозможна, а метаутопию - не то, как общество должно быть устроено, а то на основе чего оно должно быть зиждется и как развиваться. Метаутопия в отличие от утопии может быть применима в реальности и полезна для реального общества.

В основании этой метаутопии лежат два инструмента программирования - типизированный язык программирования и система контроля версий. Возьмём для примера в качестве языка программирования TypeScript, а в качестве системы контроля версий - Git. Сегодня на TypeScript пишут и веб-приложения, и мобильные приложения, и программы командной строки, и сервера для приложений. Почему бы не написать на нём государство?

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

Теперь переходим к самому болезненному и интересному этапу: миграции уже существующего веб-приложения.

В какой-то момент лента микроблогов превратилась в витрину Mac mini: люди постят открытые коробки, обсуждают автоматизацию и делятся какими-то скилами. Поводом стал Clawdbot — забавный проект open source с эмодзи лобстера, который обещает воплотить научную фантастику в жизнь. Обещается, что дома у пользователя поселится не просто чат с большой языковой моделью, а личный агент, умеющий действовать — писать в мессенджеры, трогать файлы, запускать команды, ставить софт, разруливать быт.

В реальности всё не так гладко, пусть и общаться с чат-ботом очень интересно. Но обо всём по порядку.

Как Angular Ivy находит зависимости за O(1)? Глубокое погружение в алгоритм резолва: от генерации уникальных ID токенов до битовой магии Блум-фильтров. Разбираем, почему строковые токены замедляют ваше приложение и как работает наследование кумулятивных масок в LView.

В этой статье мы познакомимся и детально изучим процесс создания приложения на кроссплатформенном фреймворке React Native. Рассмотрим, какие библиотеки понадобятся для работы, как правильно настроить структуру приложения, собрать его и протестировать его на различных устройствах.

Если вы когда-нибудь писали фронтенд на TypeScript и получали в проде Cannot read property 'x' of undefined, — добро пожаловать в клуб!

TypeScript спасает нас от сотен ошибок… но только пока код не запущен. Как только он скомпилировался, типы исчезают, и в рантайме вы снова остаетесь один на один с невалидными данными.

И вот тут начинается: меняется API, формы шлют что угодно, аналитика ломает отчёты, а тесты молчат.

В Островке мы попробовали библиотеку Valibot — легковесный runtime-валидатор, который умеет проверять данные на границах контекстов и при этом остаётся дружелюбным к TypeScript.

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

У вас есть продакшен-сервер. Он спокойно работает часами. А потом внезапно падает. Без предупреждения, без graceful-деградации. Просто мёртв.

Виновник? Одна строчка кода, которая выглядит совершенно безобидно...