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

✨ Это будущее E2E-тестирования? Как ИИ автоматизирует браузерные тесты Автоматизация end-to-end тестирования выходит на новый уровень. Вместо того чтобы вручную писать тесты в Playwright, теперь можно просто описать поведение приложения на естественном языке. ИИ берет PRD (Product Requirements Document), превращает его в сценарии на Gherkin, запускает тесты через Chrome DevTools MCP и формирует подробный отчет с результатами. В статье пошаговый пример реализации на игре "Крестики-нолики", где тестируется: от логики ходов до доступности интерфейса. 👉 https://dev.to/this-is-angular/is-this-the-future-of-e2e-testing-how-ai-automates-browser-tests-from-plain-english-requirements-1d0

✨ Краткая история JavaScript В этом году JavaScript отмечает свое 30-летие. За три десятилетия язык прошел впечатляющий путь: от простого скрипта, созданного Бренданом Айком в Netscape всего за десять дней, до одной из самых популярных и универсальных экосистем. Его история полна поворотных моментов: “войны браузеров”, конкуренция с JScript от Microsoft и, конечно, появление стандарта ES2015, который определил его современный вид. Давайте проследим, как из попытки добавить интерактивность в страницы вырос язык, на котором работает весь веб. 👉 https://habr.com/ru/companies/timeweb/articles/913894/

✨ Анонс AnalogJS 2.0 Вышел AnalogJS 2.0 — мета-фреймворк на базе Angular, Vite и Nitro. Новая версия включает множество новых функций, среди которых — content resources, оптимизация размера установки и бандла, а также обновления экосистемы Vite. 👉 https://dev.to/analogjs/announcing-analogjs-20-348d

✨ Аутентификация в Angular с помощью cookies за 10 минут Аутентификация на основе cookies — простое и эффективное решение, если вам не нужен полностью токен-ориентированный подход. Статья показывает, как за пару шагов настроить cookie-аутентификацию: получить CSRF-токен, настроить interceptors, обработать истекшие сессии, защитить роуты, а также разобраны нюансы работы с SSR. Важный момент: не забудьте корректно настроить атрибут SameSite для cookies, автор, к сожалению, это упустил. 👉 https://dev.to/this-is-angular/angular-authentication-with-cookies-in-10-minutes-41m8

✨ Мощь Intl API Интернационализация — это не просто перевод интерфейса. Это корректное форматирование дат, чисел, валют, списков и даже множественных чисел с учетом культурных особенностей пользователя. Вместо тяжелых библиотек уже давно существует нативное решение Intl API. Intl покрывает почти все задачи локализации: 🕒 Intl.DateTimeFormat форматирует дату и время, 💰 Intl.NumberFormat работает с валютами и единицами, 📋 Intl.ListFormat строит естественные списки, ⏳ Intl.RelativeTimeFormat выводит время “вчера” или “через 3 дня”, 🗣 Intl.PluralRules помогает в работе с множественными числами, 🔤 Intl.Collator сравнивает строки с учетом языковых особенностей, ⚙️ и многое другое. Intl поддерживается всеми современными браузерами и позволяет избавиться от громоздких зависимостей, сохранив при этом корректное отображение данных для любой аудитории. 👉 https://habr.com/ru/companies/timeweb/articles/939690/

✨ Как сделать селектор вариантов доступным для всех пользователей Веб-доступность часто игнорируют, считая ее второстепенной. Но на практике правильная семантика HTML делает продукт лучше для всех: пользователей с особыми потребностями, разработчиков и SEO. Статья разбирает типичный селектор вариантов, показывая, как изначальный подход на <img> ломает клавиатурную навигацию, и предлагает семантическую разметку на базе <fieldset> и радиокнопок с поддержкой клавиатуры и скринридеров. 👉 https://angular.love/case-study-building-an-accessible-variant-selector

✨ Angular официально выбирает Vitest Команда Angular наконец определилась с будущим фреймворком для тестирования, положив конец спорам, что использовать в новых проектах вместо связки Karma и Jasmine. Начиная с Angular 21, Vitest станет тестовым фреймворком по умолчанию. Самое важное в этом решении, не сам Vitest, а то, что наконец-то появилась определенность. Теперь у новых проектов есть четкий вектор развития, а это снимает головную боль при выборе инструментов. При этом возможность выбрать Karma сохранится. 👉 https://github.com/angular/angular-cli/pull/31578

✨ Ускоряем Angular: 20 советов по оптимизации Новая серия статей собрала 20 практических рекомендаций по четырем ключевым направлениям: рендеринг, реактивность, ассеты и стилизация, сборка и диагностика. Среди главных советов: переход на новый синтаксис control flow, использование отложенных представлений (@defer), миграция на сигналы и Zoneless, оптимизация изображений через NgOptimizedImage, переход на нативные CSS-анимации вместо @angular/animations, настройка билд-системы на базе Vite и esbuild. 👉 https://medium.com/ngconf/20-ways-to-make-your-angular-apps-run-faster-part-1-rendering-optimizations-51d16425bd0e

✨ Рефакторинг формы на Signal Form В статье разбирается миграция на новые Signal Forms — экспериментальную фичу, которая появится в Angular 21. В отличие от Template Driven Forms, новый API ближе к Reactive Forms, но вместо Observables использует Signals, что обеспечивает лучшую интеграцию с новой реактивной моделью Angular. 👉 https://timdeschryver.dev/blog/refactoring-a-form-to-a-signal-form

✨ Я ненавижу React В статье разбираются конкретные технические моменты: почему render() не рендерит, почему useCallback не избавляет от лишних аллокаций, зачем нужна кросс-браузерная нормализация с синтетическими событиями в 2025 году, когда стандарт событий давно единый? Отдельное внимание новому компилятору, который кеширует геттеры и меняет поведение JavaScript. Вышел откровенный разбор проблем популярного фреймворка. Хуки, компилятор и архитектурные решения, которые вызывают вопросы. А что думаешь ты? Поделись в комментариях: любишь React за его экосистему или уже устал от его ограничений? Может, нашел альтернативу, которая решает эти и другие проблемы? 😉 👉 https://habr.com/ru/articles/959358/

✨ Самый большой секрет HTML: тег <output> Все знают про <input>, но многие упускают его семантического партнера, тег <output>. Это нативный HTML-элемент для отображения результатов вычислений или действий пользователя, который решает важную задачу доступности: он по умолчанию сообщает скринридерам о динамическом обновлении своего содержимого. Он сопоставим с role="status", а с помощью атрибута for его можно семантически связать с одним или несколькими полями ввода. Это идеальное решение для калькуляторов, значений слайдера или индикаторов надежности пароля, которое работает из коробки без дополнительных ARIA-атрибутов. 👉 https://habr.com/ru/articles/957618/

✨ Полное руководство по HTTP-кэшированию Кэширование — одна из фундаментальных, но часто недооцененных технологий веба. Правильная настройка ускоряет сайты, снижает нагрузку и экономит бюджет, тогда как ошибки в конфигурации приводят к замедлению, лишним тратам и падениям под нагрузкой. В статье разбираемся, как на самом деле работают заголовки Cache-Control, Expires и ETag, чем no-cache отличается от no-store и как директива s-maxage может спасти ваш CDN. Узнайте, как избежать распространенных ошибок и выстроить надежную стратегию кэширования. 👉 https://habr.com/ru/companies/timeweb/articles/954906/

✨ URLPattern — pattern matching, который мы ждали Веб наконец-то получил удобный инструмент для сопоставления URL с шаблонами. Новый URLPattern API, уже доступен во всех основных браузерах, Node.js и Deno, позволяет элегантно проверять, парсить и валидировать ссылки, без боли и костылей с регулярками. Читай статью, чтобы увидеть примеры кода, узнать о синтаксисе шаблонов и понять, как URLPattern упростит жизнь фронтенд и бэкенд-разработчикам. 👉 https://habr.com/ru/companies/tbank/articles/955984/

✨ Как ускорить render приложения в 68 раз, и при чём тут Signals Фреймворки, построенные на Virtual DOM, достигли предела оптимизации. Даже продвинутые механики вроде React Fiber и Concurrent Mode не решают проблему. Разница в производительности колоссальна: в тестах на обновление одного элемента из тысячи оптимизированный React.memo тратит 205 мс, в то время как Solid.js и Angular справляются за 3–14 мс. 👉 https://habr.com/ru/companies/domclick/articles/956468/

✨ Декомпозиция в эпоху ИИ Вы тоже заметили, что с приходом нейросетей ценность умения писать шаблонный код снизилась, а ценность архитектурного мышления и правильной декомпозиции задач, наоборот, выросла? Теперь фокус смещается с вопроса «как это закодировать?» на «как это правильно спроектировать?». И навык разбить сложную систему на простые, логически независимые модули стал ключевым. А если заглянуть еще дальше, то и архитектура становится лишь промежуточным звеном. Приоритет смещается к тому, как развивается сам продукт, как взаимодействуют команды и как масштабируется бизнес. 👉 https://habr.com/ru/articles/956778/

✨ Скрытые затраты сигналов Оптимизация сигналов может показаться преждевременной, но в крупных приложениях игнорировать ее, значит рисковать каскадом из сотен бесполезных циклов обнаружения изменений и проверок компонентов, которые жрут ресурсы зря. В статье разбираются практические приемы, которые заставят сигналы срабатывать только при реальном изменении данных и предотвратят лишнюю работу. 👉 https://angular.love/angular-signals-the-hidden-cost-of-reference-changes

✨ Angular SSR Серверный рендеринг (SSR) в Angular эволюционировал от экспериментальной фичи к мощному инструменту, который радикально ускоряет загрузку страниц и поднимает SEO на новый уровень. Команда Angular с версии 17 добавила нативную поддержку, сделав его простым в интеграции без лишней головной боли. Статья разбирает настройку SSR, работу с метаданными, взаимодействие с кешированием и многое другое. 👉 https://angular.love/angular-ssr-everything-you-need-to-know

✨ Список вопросов о CSS для собеседования В 2025 году проверка знаний CSS выходит на новый уровень: каверзные вопросы с подвохами о свежих фичах, от :nth-child(of) до псевдоклассов вроде :user-valid и :has. Разбор этих примеров — отличный способ проверить себя и прокачать понимание современных возможностей CSS. 👉 https://habr.com/ru/companies/ruvds/articles/952546/

✨ Препарируем signal Сигналы уже давно стали частью Angular и других фреймворков. Но что на самом деле происходит под капотом, когда значение меняется и UI реактивно обновляется? Сергей Кулаев шаг за шагом реализовал собственные аналоги signal, computed и effect, чтобы наглядно продемонстрировать их внутреннюю логику. 👉 https://habr.com/ru/companies/psb/articles/955912/

✨ Как не сойти с ума на умной работе Многие айтишники рано или поздно сталкиваются с чувством выгорания, даже если задачи интересные, команда классная, а отпуск вроде бы помогает. Александр Царёв поделился личным опытом: ни сериалы, ни путешествия, ни смена проектов не спасают от хронической усталости. Помогло простое решение — ручной труд. Гараж, сад, ремонт, даже сборка мебели. Все, где есть физический результат, возвращает ощущение живости и баланс между виртуальным и реальным мирами. 👉 https://habr.com/ru/articles/951532/