Angular v22 출시 — Signal Forms·비동기 API 정식 안정화, Zoneless가 기본값 된다

Signal 시대의 성숙: "프로덕션 준비 완료"

Angular 팀은 v22를 한마디로 요약한다: "Production Ready is the Name of the Game." 지난 두 메이저 버전 동안 실험적(experimental) 또는 개발자 프리뷰(developer preview) 상태로 유지됐던 세 가지 핵심 API가 이번 릴리스에서 모두 안정(stable)으로 격상됐다.

안정화된 3대 핵심 API

1. Signal Forms — 반응형 폼의 완전한 재설계

Signal Forms는 Reactive Forms의 강력함과 Template-driven Forms의 직관성, 그리고 Angular Signals의 반응성을 하나로 합쳤다. v22에서 프로덕션 안정 버전이 됐으며, Angular Material 및 Angular Aria와의 완전한 통합도 이뤄졌다.

import { form } from "@angular/forms/signals";

class Payment {
  readonly paymentModel = signal({ paymentType: '', amount: 0 });
  readonly f = form(paymentModel, schema => {
    required(schema.paymentType, { message: 'Required field' });
  });
}

핵심 장점: 필드 하나가 변경될 때 불필요한 전체 리렌더링이 없고, TypeScript 타입 시스템과 완벽하게 통합된다.

2. Angular Aria — 모든 사용자를 위한 접근성 패턴

v21에서 도입된 Angular Aria가 v22에서 정식 안정 버전이 됐다. 12가지 UI 접근성 패턴이 Signal Forms와 완전히 통합되며 테스트 하네스도 제공된다. 개발자는 스타일과 비즈니스 로직에 집중하면 되고, 접근성 처리는 프레임워크가 담당한다.

3. Asynchronous Reactivity — resource·httpResource 안정화

HTTP 요청을 신호(Signal) 기반으로 선언적으로 처리할 수 있는 resource·rxResource·httpResource API가 모두 안정화됐다.

export class WeatherComponent {
  selectedCity = signal('Seoul');
  weather = httpResource<{ temperature: number }>(() =>
    `https://api.example.com/v1/forecast/${this.selectedCity()}`
  );
}

selectedCity 신호가 바뀌면 HTTP 요청이 자동으로 재실행된다. 로딩·에러·데이터 상태를 명시적으로 관리할 필요가 없다.

변경 감지 전략의 새 기본값: OnPush

v22부터 새 애플리케이션에서 OnPush가 기본 변경 감지 전략으로 지정된다. 이는 Zoneless Angular의 방향과 일치하며, 개발자가 별도로 명시하지 않아도 성능 최적화가 적용된다. 기존의 ChangeDetectionStrategy.Default는 ChangeDetectionStrategy.Eager로 이름이 바뀐다.

개발자 경험(DX) 향상 주요 기능