상세 컨텐츠

본문 제목

React와 Vue

Programming/Vue

by 쌩우 2019. 8. 1. 21:48

본문

공통점

  • 가상 DOM의 활용
  • 반응적이고 조합 가능한 컴포넌트의 제공
  • 코어 라이브러리에만 집중
  • 라우팅 및 전역 상태를 관리하는 컴패니언 라이브러리 존재

갱신

React
컴포넌트의 상태가 변경되면, 해당 컴포넌트에서 루트로 시작하여 전체 컴포넌트 하위 트리를 다시 렌더링한다.
불필요한 자식 컴포넌트의 rerender를 피하려면,
어디에서나 shouldComponentUpdate를 구현하고 변경 불가능한 데이터 구조를 사용해야 한다.

Vue
컴포넌트의 종속성이 렌더링 중 자동으로 추적되므로 시스템은 실제로 다시 렌더링해야하는 컴포넌트를 정확히 알고 있다.

언어

React
모든 것이 Javascript이다.
HTML 구조는 JSX를 통해서 입력되고,
CSS 마저도 Javascript에서 하는 추세이다.
신박할 수도 있지만, 모든 개발자들에게 적합하다고 하기에는 단점이 있다.

Vue
고전적인 웹 기술들을 받아들인 후, 그것을 기반으로 하여 만들어졌다.

JSX와 Template의 비교

JSX의 장점

  • 완전한 프로그래밍 언어(Javascript)를 이용하여 뷰를 만들 수 있다.
  • JSX의 툴 지원(linting, type test, 자동완성 기능)

Template의 장점

  • HTML로 작업해오던 개발자들의 접근성
  • 러닝 커브가 낮은 편
  • 컴포넌트 범위의 merge

Vue의 장점?

  1. 네이티브 렌더링
    : Weex와 공식 협업을 맺고 있다고 한다. 같은 Vue 컴포넌트 문법을 사용하여 브라우저에서 렌더링할 수 있을 뿐만 아니라, iOS, android에서도 렌더링 할 수 있는 컴포넌트를 작성할 수 있다. 하지만 Weex는 아직 개발중이라고 한다.
  2. 규모 확장
    : 강력한 라우팅 솔루션을 제공한다. Webpack이나 Browserify 또는 빌드 시스템 사용안함을 포함하여, 원하는 빌드 시스템을 사용 하여 새 프로젝트를 쉽게 시작할 수 있게 해주는 CLI 프로젝트 생성기를 제공한다.

'Programming > Vue' 카테고리의 다른 글

props static way & dynamic way - vue  (0) 2019.08.03
Vue js Life cycle 라이프 사이클  (0) 2019.08.01
vue로 숫자야구 하기  (0) 2019.07.25
v-for 와 변수 in Array반복문  (0) 2019.07.25
webpack  (0) 2019.07.25

관련글 더보기

댓글 영역