TypeScript *

Почти три года я в одиночку строил бэкенд-фреймворк поверх 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 репозиториях.

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

Vibe coding — это одновременно и мем, и реальность 2025-2026 года. Кто-то называет это будущим разработки. Другие считают, что это способ генерировать технический долг со скоростью света.

Мы решили попробовать создать коммерческий проект с нуля полностью с помощью вайбкодинга. В результате: 46 000 строк кода, полтора месяца, два человека. Проект работает, клиент пользуется.

Вообще как бы нифига себе – написать рабочую CRM, которая автоматизирует обработку входящих запросов и может автоматически работать по сделкам: отвечать на письма, ставить задачи, проводить сделку по воронке.

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

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

Знаете это чувство, когда сидишь на очередном спринт-планировании, команда пытается оценить таски, а планинг покер тормозит так, что успеваешь кофе сварить, пока карточка загрузится?

Вот у меня в AGG TEAM такая же история была. Мы пробовали:

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

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

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

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

Я не 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 режимы и тщательно протестированная отказоустойчивость. В статье не буду пересказывать документацию на русском и английском, а поговорю скорее про общие принципы качества, использование ИИ в разработке и почему многие библиотеки раздуваются, не успев даже стабилизировать ядро.

Сравнил полнотекстовый поиск PostgreSQL (tsvector/tsquery + GIN-индекс) с семантическим поиском через pgvector (cosine distance) на датасете из 10 019 товарных категорий Ozon.

Три embedding-модели:

GigaChat EmbeddingsGigaR (Сбер, 2560-мерные векторы, API)

Qwen3-Embedding-0.6B (Alibaba, 1024-мерные, локальный инференс через HF Text Embeddings Inference на GPU)

text-embedding-3-small (OpenAI, 1536-мерные, API)

Прогнал 18 запросов в пяти категориях: синонимы и сленг, intent-запросы в свободной форме, подарочная тематика, cross-lingual (EN-запросы к RU-данным), абстрактные формулировки. Замерил латентность и top-5 с cosine similarity score.

Разбор каждого запроса, таблицы и код — под катом.

Я делаю Beetroot — клипборд-менеджер для Windows на стеке Tauri + React + Rust + SQLite. В моей ежедневной базе 1000+ записей: куски кода, URL-ы, стектрейсы, SQL-запросы, переписки из мессенджеров. Поиск по всему этому должен работать мгновенно и попадать точно в цель.

Сначала я пошёл по простому пути: подключил популярную библиотеку Fuse.js и думал, что задача решена. Но реальные данные буфера обмена оказались для неё патологическим кейсом.

Эта статья — про путь от «просто подключи готовую либу» до самописного 5-уровневого движка с мерж-скорингом. Два дня, 8 итераций, пара красивых продуктовых багов по дороге.

Это большая статья про дешевую локальную автоматизацию на основе VRack2. Будет очень много тем разной направленности. Работа с железом, мелкие сервисы, организация инфраструктуры.

По сути это компиляция моей работы за последние несколько лет. Важно подметить - моей и только моей.

Если какая-то тема не привлекает - просто переходите к следующей, скорее всего на что-нибудь интересное наткнетесь.

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

Effect-фреймворк, который никого не может оставить равнодушным. Читая комментарии к другим постам, я заметил, что добрая часть хабра считает, что эффект это избыточно сложная и не особо нужная технология. В своей статье я обозначаю 10 причин, почему эту технологию стоит попробовать, даже если вы дико предвзятый разработчик, а также даю экскурс по базам фреймворка.

За прошедшие две недели я узнал, что сначала Anthropic, а потом Open AI запустили программы поддержки open source проектов: Claude for Open Source и Codex for Open Source. Я подал заявку в обе программы со своим open source проектом и мои заявки одобрили.

Какие были требования, что это даёт и как я буду применять новые инструменты — ниже.

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

И будет здорово, если их первая реакция будет не «ну, работает», а «вау, это выглядит как полноценный продукт».

Почему разработчикам вообще стоит задумываться о пользовательском опыте? Кажется, что это зона ответственности product/project-менеджеров, UX-дизайнеров и аналитиков. Но на практике у разработчиков в мобильных проектах есть довольно большая свобода влиять на UX-детали.

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

Меня зовут Алексей Цуцоев, я Frontend TeamLead в KODE. В этой статье разберу несколько библиотек, которые позволяют быстро улучшить UX React Native-приложения без значительных затрат на разработку.

Привет!

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

В этом выпуске — CodePen 2.0 и клон Loom на Next.js в видео; про AI: почему коллекция промптов не заменяет мышление, автоисследования на игровом PC и онбординг через Oncode. Безопасность в центре: Clinejection (4000 машин через GitHub-issue), как GitHub защищает агентские воркфлоу, укорочение срока жизни TLS-сертификатов, веб-агенты, сливающие данные пользователей, и 22 CVE в Firefox после проверки кодовой базы Claude. В CSS — все способы выбрать <html>, война z-index и подводный камень Anchor Positioning; в JS — когда пора переходить на Rust, разбор requestAnimationFrame и постмортем npm-червя Shai-Hulud. По фреймворкам: ретро-компоненты и cron-генератор в React, микрофронтенды в Angular 21. Веб-стандарты: обновление WCAG 3 и отчёт TC39 про ES2026. Браузеры: Chrome переходит на двухнедельные релизы, Edge предлагает атрибут focusgroup. Плюс VS Code 1.111 с инфраструктурой для Copilot-агентов, «убедительный дизайн» и усталость от токенов, TDD в эпоху AI, элемент <geolocation>, AT Protocol под капотом Bluesky и запуск Cursor-агентов из Telegram.

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

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

И один лишь рынок особой категории геоданных, именующих себя детьми лейтенанта Шмидта, находится в хаотическом состоянии. Анархия раздирала корпорации вроде Гугла… Ладно, я увлёкся. Но в самом деле…

Всем привет! Если вы следите за темой вайбкодинга, то наверняка замечали как быстро всё меняется. Ещё год назад я генерил одностраничные HTML-файлы, радовался жизни и был уверен что вайбкодинг - он вот про это. Странички, кнопочки, красивый фронтенд. А потом как-то незаметно оказалось что мне нужна база данных, авторизация, платёжная система и тесты. Это как зайти в IKEA за свечкой и выйти с кухней.

Вайбкодинг за последний год изменился до неузнаваемости. Сейчас это не "сгенерь мне страничку" - это полноценная разработка с бэкендом, PostgreSQL, OAuth авторизацией, эквайрингом от Т-Банка, тестами и автодеплоем. Настоящий небоскрёб. И каждый кирпичик в нём выбран не случайно - самые беспроблемные технологии которые я нашёл за время своих скитаний по разным стекам и агентам. Чтобы строить легко и с удовольствием. Ну или хотя бы без желания выкинуть ноутбук в окно.

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

История фронтенда хорошо показывает, что инструменты редко исчезают мгновенно. Чаще они проходят понятный цикл: сначала решают конкретную проблему и быстро набирают популярность, потом становятся привычной частью стека, а со временем уступают место следующему подходу. Примерно так развивается и CSS-in-JS. Когда он появился, это выглядело логичным шагом: стили рядом с компонентами, темы, токены и удобная интеграция с React. Со временем стало ясно, что у этой модели есть и ограничения — стили генерируются в рантайме, усложняется SSR, а в больших приложениях начинают накапливаться накладные расходы. Появились попытки сделать CSS-in-JS легче и быстрее. Одной из них стал Stitches: он сохранил удобный DX и заметно сократил рантайм. Но развитие проекта остановилось, а требования к фронтенду продолжают расти. Поэтому всё чаще обсуждают другой подход — перенос генерации стилей на этап сборки. В этой логике и появился StyleX.

Сайт на Тильде есть, трафик идет, но 20% заказов теряются в Telegram, а менеджеры работают вслепую. Покупать дорогую CRM или писать свой бэкенд?

Последние полтора года я использую Cursor IDE в качестве основной среды разработки. Сначала использовал её как среду с просто удобным автодополнением строк (относительно GitHub Copilot). Потом AI стал умнее, удобнее, появился режим планирования и Claude стал базовым атрибутом моего рабочего дня.

Неделю назад мой open source проект Databasus (инструмент для резервного копирования PostgreSQL, ~6k звёзд ⭐️ и ~275k Docker pulls) получил поддержку от Anthropic в рамках OSS программы: и теперь у меня есть Claude Code Max на ближайшие полгода. Следовательно, я переключился на него... и осознал, что очень сильно привык к UX в Cursor IDE. Самые умные безлимитные модели — это, конечно, классно. Но удобство и контроль за изменениями для меня в приоритете.

Поэтому я взял Opus и навайбкодил расширение для VS Code, которое приближает взаимодействие с CLI агентами к опыту Cursor IDE: когда ты видишь изменения и можешь точечно их корректировать. Пара потраченных часов сделали работу в ближайшие полгода для меня ощутимо комфортнее.

Что и как я делал — ниже.