Angular vs React

Angular( 구글 )

Angular는 프레임워크이기 때문에 이미 앱을 만들기 시작할 모든 개발 도구들을 가지고 있습니다.

RxJS의 가장 큰 장점은 이벤트를 독립적으로 동시에 처리 할 수 있다

• Angular를 완전히 활용하려면 Rxjs를 배워야한다는 것
• 프레임 워크는 병렬적으로 컴포넌트를 실행하도록 분리시켜 재설정 하지 않아도 의존관계의 컴포넌트를 대체할 수 있습니다.
• Ivy renderer: Ivy는 차세대 Angular 렌더링 엔진으로 성능을 크게 향상시킵니다
• Angular Universal는 서버 사이드 렌더링 기술입니다. 이것을 사용해 App의 첫페이지를 빠르게 렌더링할 수 있고 , 모바일 디바이스처럼 브라우저 렌더링 리소스가 부족한 디바이스에서 화면을 나타낼 수 있습니다.
• Aptana, WebStorm, Sublime Text, Visual Studio Code 는 일반적으로 Angular와 함께 사용되는 코드 편집기 및 IDE입니다.
• Jasmine, Karma, Protractor 는 브라우저에서 End-To-End Test 및 디버깅을 위한 도구입니다.

React ( 페이스북 )

React는 실제로 프레임워크가 아니라 라이브러리입니다. 이는 추가 개발도구 및 라이브러리를 여러 번 통합해야 한다는 것을 의미합니다

• Redux는 상태를 관리하는 컨테이너로 React로 대규모 응용프로그램을 짤 때 사용하면 효과적입니다. 많은 동적 요소가 있는 응용 프로그램의 구성 요소를 관리하며 렌더링에도 사용됩니다. 또한 React는 Redux 용 선택기 라이브러리 및 Redux DevTools Profiler Monitor를 포함하는 더 넓은 Redux ToolSet와 함께 작동합니다.
• Babel은  JSX를 어플리케이션이 JavaScript로 변환을 시킴으로써 브라우저에서 이해할 수 있도록 해주는 트랜스 컴파일러입니다.
• Webpack은 모든 구성 요소가 서로 다른 파일로 작성되므로 더 나은 관리를 위해 구성 요소를 Bundle로 묶어줍니다. Webpack은 표준 코드 Bundle로 간주됩니다.
• React Router는 React와 함께 일반적으로 사용되는 표준 URL 라우팅 라이브러리입니다.
• Angular와 마찬가지로 코드 선택면에서도 제한되지 않습니다. 가장 일반적인 편집기 및 IDE로는 Visual Studio Code, Atom 및 Sublime Text 입니다.
• Angular와 달리 React에서는 단일 Tool로 전체 앱을 테스트 할 수 없습니다. 각기 다른 테스트 유형마다 별도의 Tool을 사용해야합니다. React는 다음 Tool들과 호환됩니다.
  • Enzyme /  Unexpected-react : 컴포넌트 테스팅
  • Jest :  자바스크립트 코드
  • react-testing-library : React DOM 테스팅
  • React-unit :  unit 테스팅
  • Skin-deep : Rendering Test utils

결론:

• Angular와 React의 가장 큰 차이점은 Angular는 프레임워크(Framework)이고 React는 UI 구성요소 라이브러리라고 할 수 있다. 쉽게 표현하자면 React는 자체적으로 개발에 필요한 모든 요소들을 제공하지 않으며 제대로 활용하기 위해선 추가적인 구성이 필요하기 때문에 엄격히 말해 프레임워크라고 표현하지 않는다.
• 각 프레임워크의 개괄적이 비교는 개발사가 Google과 Facebook 이고, HTML 스크립팅이 Template 기반인지 JSX를 이용하는지, 양방향 데이터 바인딩인지 Virtual DOM diff를 이용한 데이터 동기화가 이루어지는지 정도가 되겠다.
• 무엇이 더 낫다고 말 할 수도 없으며, 지금의 트랜드라고 주장하기도 어려울 정도로 Webpack(https://webpack.js.org/) 기반의 용량 비교를 해보아도 눈에 띄는 차이가 없으며, 처리 속도와 사용하는 메모리 용량에 대한 차이도 거의 없다

출처: https://bit.ly/3O31A0n