🦊 Angular Fox 🚀 — русскогорящие новости сообщества

✨ State Management в Angular 19+

Раньше выбор стоял между четырьмя подходами. Простое решение на Service + BehaviorSubject, мощный, но громоздкий NgRx, более легкая NGXS и Akita которая, впрочем, уже мертва, репозиторий заархивирован, а ее преемник Elf разделил ту же судьбу.

В статье автор разобрал сильные и слабые стороны каждого подхода и объяснил, почему NgRx Signal Store стал главным кандидатом для новых проектов.

👉 https://habr.com/ru/articles/1050992/

✨ Эволюция сложных форм

Помните недавний пост про переход с React на Angular? В самом тексте статьи слегка резануло использование старых подходов. Да и в комментариях метко подметили: “Я как будто прочитал статью из 2020. Ни одной свежей фичи…”.

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

Чтобы частично закрыть этот вопрос и показать, как выглядит современный Angular, давайте пройдемся по новым способам создания форм.

Статья была опубликована около месяца назад, и за это время Signal Forms перестали быть экспериментальными. Заодно в релизе слегка изменился API, так что примеры из статьи местами устарели (и за актуальным состоянием лучше обратиться к документации), например, директива в шаблоне теперь называется formField вместо field.

👉 https://habr.com/ru/articles/1039254/

✨ Разбираемся в A2UI

A2UI не очередной UI-фреймворк, а протокол, который позволяет агентам динамически генерировать интерактивные интерфейсы без выполнения произвольного кода.

Агент на сервере собирает структуру из доступных строительных блоков и отправляет JSON, а клиентское приложение читает его и отрисовывает нужные элементы. Это позволяет создавать приложения, которые на лету адаптируются под то, что именно хочет сделать пользователь.

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

👉 https://blog.angular.dev/demystifying-a2ui-how-to-make-ai-agents-speak-ui-in-your-app-e1ffea2303bd

✨ Vibecode по дешевке

Недавно Anthropic одним решением отключила Fable 5 для большинства пользователей. И это хороший повод задуматься, насколько безопасно строить свой рабочий процесс вокруг облачной модели, доступ к которой в любой момент может исчезнуть?

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

👉 https://habr.com/ru/articles/1049052/

✨ Странный театр технического найма

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

И проблема не в том, что интервью сложные, а в том, что они сложные не в том, что важно.

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

👉 https://www.angularspace.com/the-strange-theatre-of-technical-hiring/

✨ Как я перешёл с React на Angular и не пожалел

Переход с React на Angular многим кажется как шаг против течения. Вокруг React-экосистема, тысячи гайдов и вакансий, а Angular воспринимается сложным и только для энтерпрайза.

Илья Королёв рассказал о своем опыте перехода на новый стек, первых неделях работы с непривычной архитектурой, RxJS, сервисами и dependency injection, а также о том, почему Angular оказался гораздо логичнее и удобнее, чем он ожидал.

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

👉 https://habr.com/ru/companies/centicore_group/articles/1048598/

✨ Как Angular v22 решил проблему дублирующихся host directives

Среди громких новинок v22 почти затерялось изменение, которое ждали авторы библиотек.

Проблема возникала, когда одна и та же директива попадала на элемент через разные цепочки композиции. Поэтому приходилось заранее учитывать все возможные комбинации директив.

Теперь Angular умеет дедуплицировать такие директивы, создает единственный экземпляр и объединяет публичный API.

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

👉 https://habr.com/ru/companies/tbank/articles/1048446/

✨ Вопросы на собеседование

Если вы готовитесь к смене работы или просто хотите прокачать скиллы, ловите подборку вопросов по рефакторингу TypeScript.

В статье разобрали типичные вопросы про рефакторинг: от as const satisfies до того, как шаблонные строковые типы спасают от опечаток в API.

👉 https://habr.com/ru/articles/1033686/

✨ Вышел TypeScript 7.0 RC

Команда TypeScript выпустила релиз-кандидат версии 7.0.

Что нового:
⚙️ Гибкий параллелизм: Парсинг и чек типов теперь идут параллельно. Добавлены флаги --checkers (по умолчанию 4 потока для проверки типов) и --builders (для сборки монорепозиториев). Для отладки есть флаг --singleThreaded.

👀 Улучшенный --watch режим: Старый вотчер заменили на Go-порт от Parcel (который годами использовался в VS Code).

🤝 Совместимость: Логика проверки типов идентична TS 6.0.

⚠️ Новые дефолты: Подтянуты строгие дефолты из 6.0 (strict: true, module: esnext и т.д.) и удалено легаси.

🎨 Адекватная работа с Unicode: Эмодзи больше не разбиваются при выведении типов.

🧹 Чистка JS/JSDoc: Поддержка JavaScript-файлов переосмыслена.

💻 Редакторы: Официальный экстеншен TypeScript Native Preview для VS Code работает поверх LSP, использует многопоточность и, по статистике, выдает в 20 раз меньше ошибок чем 6.0.

👉 https://devblogs.microsoft.com/typescript/announcing-typescript-7-0-rc/

✨ Understand Anything

Зашли в легаси-проект на кучу строк кода и не знаете, с чего начать? Хватит читать код вслепую!

Встречайте Understand Anything - инструмент, который превращает код в интерактивный граф знаний.

Что он умеет:
Визуальный граф. Каждый файл, функция и класс кликабельный узел. Можно масштабировать, искать и исследовать связи.

Понимание бизнес-логики. Показывает, как код маппится на реальные бизнес-процессы и домены.

Семантический поиск. Спросите “какие части отвечают за авторизацию?” и получите релевантные узлы графа.

Визуализация слоев. Автоматическая группировка по архитектурным слоям (API, Service, Data, UI, Utility и т.д.).

Пошаговые туры. Автоматические экскурсии по архитектуре, чтобы изучать проект в правильном порядке.

Посмотреть демо можно здесь.

👉 https://github.com/Egonex-AI/Understand-Anything

✨ Новый Angular UI Kit

Это не очередная обертка над Angular Material, а свежая модульная библиотека компонентов, вдохновленная принципами Material Design 3.

Главные фишки:
🧩 29 компонентов уже доступны (от кнопок и карточек до диалогов и date/time пикеров). Отдельные точки входа для каждого компонента. Импортируйте только то, что используете.
⚡️ Современный стек (Standalone, Signals и Zoneless).
🧱 Вдохновлены Material Design, но не зависят от Angular Material.
🎨 Настраиваемые темы и дизайн-токены на базе M3
🧪 Покрыто тестами на Vitest

👉 https://github.com/ngguide/ui

✨ Как один человек в 1965-м добавил null

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

В 1965 году он проектировал систему типов для ALGOL W и добавил в нее null-ссылку просто потому, что это было легко реализовать. И позже назовет это решение ошибкой на миллиард долларов.

Проблема оказалась не в самом факте отсутствия значения, а в том, что компилятор перестал отличать пустоту от реального объекта. Язык молча пропускал такие места, оставив разработчикам бесконечные ночные дежурства, когда падает прод.

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

Главный урок этой истории в опасности иллюзии простых решений.

👉 https://habr.com/ru/articles/1045718/

✨ Как работала самая первая нейросеть в истории?

Мы привыкли, что нейросети за секунды рисуют картинку или пишут текст. Но когда-то это был гигантский шкаф, занимавший целую комнату, и он едва справлялся с тем, чтобы отличить одну перфокарту от другой.

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

👉 https://habr.com/ru/companies/kemp_ai/articles/1035312/

✨ Использование Blob API

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

В статье разбираем, как Blob API помогает решать такие задачи правильно.

👉 https://habr.com/ru/companies/timeweb/articles/1041940/

✨ WebMCP. Что скрывается за черновиком стандарта

В Angular недавно добавили экспериментальную поддержку WebMCP. И это отличный повод разобраться в новом стандарте, который способен перевернуть привычный нам веб.

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

WebMCP предлагает сайту самому объявить свои возможности через простой API. Агент получает машиночитаемый контракт и напрямую вызывает нужную функцию. Быстро и эффективно.

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

👉 https://habr.com/ru/articles/1031164/

✨ Многофункциональные списки ng-virtual-list как замена стандартным

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

Автор open-source библиотеки ng-virtual-list рассказал, как создавал универсальный инструмент для визуализации списков, который умеет гораздо больше, чем просто отрисовывать элементы.

👉 https://habr.com/ru/articles/1045454/

🔥 Как я сжёг 17,4 миллиарда токенов за 25 дней.

Как один человек за месяц закрыл работу целой команды и не получил ни одного бана от Anthropic?

Механика этого эксперимента:
Автор использует 10 агентов: 1 оркестратора (он решает, кого звать на конкретную правку), и 9 профильных ревьюеров (Frontend, Backend, QA, DevOps, Security, Billing, Architect и др.). Они проверяют новый код под разными углами, пока не останется ни одного блокера.

97% токенов, чтение из кэша. Основные затраты идут на многократное перечитывание контекста для проверок. Без настройки кэширования счет перевалил бы за $250k. Но в итоге составил $200, за подписку.

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

Писать код больше не главный навык. Ценность инженера сместилась с генерации на верификацию и оркестрацию.

👉 https://habr.com/ru/articles/1045140/

✨ Прошел 15 собесов за месяц

Месяц назад автор статье уволился из аутсорса и думал, что найдет работу за пару недель. Вышло по-другому.

Сухая статистика:
15 собеседований за 28 дней
1 нормальный фидбек из 15
6 компаний просто пропали
4 оффера, 1 принял
Примерно 37 часов потрачено на собесы + тестовые

Паттерны по размеру компаний:
🚀 Стартапы до 30 человек: 1-2 созвона, решение за день.
🏢 100-500 человек: 3-4 этапа, 2-3 часа, решение за 1-2 недели.
🏦 Крупные банки: 4-5 этапов, 3-5 часов, решение 2-6 недель.
🏛 Гос через подрядчиков: резюме исчезает в черной дыре.

Главный инсайт:
Перед собесом подготовьте свой GitHub и не тратьте больше 4 часов на тестовое. Если не ответили через неделю, считайте отказом.

Также у нас есть профильный чат для поиска работы и людей @angular_jobs

👉 https://habr.com/ru/articles/1042250/

🚀 Angular 22

Продолжаем тему Angular 22. Если в прошлой статье прошли по официальным новостям, то теперь разбор от Манфреда Штайера с примерами кода и практическими деталями.

Он посмотрел на релиз через призму реальной разработки, разбирая главные фичи на живых примерах.

👉 https://www.angulararchitects.io/en/blog/angular-22-the-most-important-new-features-at-a-glance/

🚀 Вышел Angular 22

Команда Angular выпустила 22-ю версию фреймворка. Релиз получился очень насыщенным.

🔥 Что стало стабильным
Signal Forms, Angular Aria, resource и httpResource.

🤖 Эра нейросетей
Обновили MCP, добавили Agent Skills и экспериментальный WebMCP.

🛠 Улучшения API
Добавили декоратор @Service, injectAsync, поддержку TypeScript 6 и интеграцию роутера с нативным Navigation API браузера.

✨ Шаблоны
Поддержка spread/rest-синтаксиса, стрелочные функции, комментарии внутри HTML-элементов и улучшения в @switch.

⚙️ Другие изменения и планы
OnPush теперь дефолтная стратегия для новых приложений. ChangeDetectionStrategy.Default переименован в Eager. Скоро выйдет @boundary - Error Boundaries прямо в шаблонах. Также команда фокусируется на поддержке TSGo.

👉 https://blog.angular.dev/announcing-angular-v22-c52bb83a4664