Angular 소개와 특징

Angular 소개와 특징

Angular는 SPA(Single Page Application) 개발을 위해 구글에서 만들어진 오픈 소스 JavaScript Framework 입니다. 프론트엔드 개발에 필요한 대부분의 기능을 갖추고 있으며, TypeScript 를 주력 언어로 채택하여 대규모 어플리케이션 개발에 적합한 환경을 제공합니다. 

1. Angular 소개

Angular 는 이전 버전인 AngularJS 의 후속 버전으로 2014년 처음 소개되었고 이후 지속적인 개선을 거치며 새로운 버전이 release 되고 있습니다. Angular는 AngularJS의 후속 버전이기는 하지만 호환성이 없는 새로운 프레임워크로 보는 것이 좋습니다. Angular는 AngularJS보다 학습이 쉽고 성능은 향상되었으며 애플리케이션 구조는 보다 단순해졌다는 특징을 가지고 있습니다.

1.1. Angular와 AngularJS의 차이 및 특징

Angular는 정적 타이핑과 ECMAScript6 스펙의 충족을 위해 TypeScript로 작성되었고 AngularJS와는 호환성이 없는 브레이킹 체인지를 다수 포함하고 있습니다.

Angular와 AngularJS의 차이점과 특징은 다음과 같습니다.

• 컴포넌트 기반 개발 (CBD, Component Based Development)
  AngularJS의 Controller, $scope 기반 개발에서 컴포넌트 기반 개발로 전환.
  컴포넌트 기반의 개발은 개발 생산성을 높이고 대규모 애플리케이션에 적합한 구조 설정을 가능하도록 함.
• 향상된 모듈 시스템과 DOM 제어 기능 제공 및 API 단순화
  
• 단방향 또는 양방향의 선택적 데이터 바인딩 지원
• 디렉티브(Directive)와 서비스, 의존성 주입(DI, Dependency Injection)의 간소화
• 주력 개발 언어로 TypeScript 도입
  대규모 개발에 적합한 정적 타입, 인터페이스, 제네릭 등의 타입 체크 기능과 코드 어시스트, 리팩토링 기능 제공.
  모듈, 클래스, 인터페이스 등의 객체지향 프로그래밍(OOP, Object Oriented Programming) 지원.
  명시적 정적 타입 지정으로 코드 가독성을 높이고 컴파일 단계에서 오류 확인이 가능.
• Angular CLI(Command Line Interface) 제공
  개발 도구 통합 및 개발 환경 구축 자동화
  명령어를 통해 프로젝트 생성, 빌드, 테스트, 구성요소 추가 등을 간편하게 이용
  
  

1.2. Angular의 향상된 성능 

Angular의 향상된 성능에 대해 정리하면 다음과 같습니다.

• 다이제스트 루프로 인한 성능 저하 문제 해결
  Model의 변화를 View에 반영하는 다이제스트 루프로 인한 성능 저하 문제를 해결.
  양방향 데이터 바인딩의 와처(Watcher)가 늘어날수록 성능이 떨어지는데 Angular에서는 이 문제를 개선함.
• AoT 컴파일
  AoT(Ahead of Time) 컴파일이라는 사전 컴파일 방식을 지원.
  ngIf, ngFor, ngSwitch와 같은 구조 디렉티브(Stuructural Directive)를 사전에 컴파일하여 실행 속도를 향상.
• 지연 로딩
  지연 로딩(Lazy Loading)은 SPA의 태생적 단점을 극복하기 위한 대안.
  애플리케이션에서 사용 되는 모든 모듈을 한번에 로딩하지 않고 필요한 시점에 필요한 모듈만 로딩하는 방식.
  불필요한 모듈의 로딩을 줄여 페이지 로딩 속도를 높여줌.
• 코드 최적화
  Angular는 모바일 퍼스트를 지향하는 고성능 프레임워크를 표방하며 이를 위해 코드 최적화를 꾸준히 진행하고 있음.

1.3. 브라우저 지원 범위

브라우저별 Angular 지원 현황은 다음과 같습니다.

Chrome	Firefox	Edge	IE	Safari	iOS	Android	IE Mobile
latest	latest	14	11	10	10	Nougat(7.0) Marshmallow(6.0)	11
-	-	13	10	9	9	Lollipop(5.0, 5.1)	-
-	-	-	9	8	8	KitKat(4.4)	-
-	-	-	-	7	7	Jelly Bean(4.1, 4.2, 4.3)	-

이상으로 Angular에 대한 간단한 소개와 특징에 대해 알아봤습니다.

※ 참고 문헌

• 이웅모 지음, 『Angular Essentials』, 루비페이퍼(2018), p2 ~ p7. 01. Angular의 소개와 특징