vue react 프레임 워 크 대비

4293 단어 Front-endDevelopment
vue react 프레임 워 크 대비
1.공통점:
4.567917.모두 구성 요 소 를 지원 합 니 다.모두 데이터 구동 보기 입 니 다.4.567918.
  • Virtual DOM(가상 dom)을 사용 하여 응답 식(Reactive)과 구성 요소 화(Composable)의 보기 구성 요 소 를 제공 합 니 다

  • 2.차이 점:
    vue 는 본질 적 으로 MVVM 프레임 워 크 이 고 MVC 에서 발전 한 것 이다.React 본질은 전단 구성 요소 화 프레임 워 크 이 고 백 엔 드 구성 요소 화 에서 발 전 된 것 입 니 다
  • Vue 는 HTML 템 플 릿 을 사용 하여 렌 더 링 을 하고 Angular 스타일 과 비슷 한 방법 으로 동적 인 내용 을 출력 하도록 권장 합 니 다.따라서 기 존의 템 플 릿 을 새로운 Vue 템 플 릿 으로 통합 함으로써 Vue 는 오래된 응용 업 그 레이 드 를 제공 하기 쉽다.React/jsx 는 템 플 릿 이 아 닌 자바 스 크 립 트 를 사용 하여 개발 자 에 게 많은 프로 그래 밍 능력 을 부여 합 니 다

  • 비교
    1.렌 더 링 성능
    지금까지 현실 에 대한 테스트 에서 Vue 의 성능 은 React 보다 좋 았 습 니 다./
    JavaScript 비용 은 필요 한 DOM 작업 을 계산 하 는 메커니즘 과 직 결 됩 니 다.Vue 와 React 는 모두 Virtual DOM 을 이용 하여 이 목 표를 실현 하지만 Vue 의 Virtual DOM 실현(snabbdom 의 분기)은 무게 가 훨씬 가 벼 워 React 보다 비용 이 적 습 니 다.(렌 더 링 성능)
    2.성능 업데이트
    React 에서 구성 요소 의 상태 가 변 할 때 전체 구성 요소 서브 트 리 를 다시 보 여 줍 니 다.이 구성 요소 부터 루트 로 시작 합 니 다.
    하위 구성 요소 에 대한 불필요 한 재 구현 을 피하 기 위해 서 는 어느 곳 에서 든 shouldComponent Update 를 실현 하고 가 변 적 이지 않 은 데이터 구 조 를 사용 해 야 합 니 다.Vue 에서 구성 요소 의 의존 관 계 는 렌 더 링 과정 에서 자동 으로 추적 되 기 때문에 시스템 은 실제 렌 더 링 이 필요 한 구성 요 소 를 정확하게 알 수 있 습 니 다.
    최적화 되 지 않 은 Vue 는 최적화 되 지 않 은 React 보다 훨씬 빠르다.Vue 가 렌 더 링 성능 을 개 선 했 기 때문에 심지어 전면적으로 최 적 화 된 React 도 상 자 를 열 때 사용 하 는 Vue 보다 느 릴 수 있 습 니 다.
    3.데이터 바 인 딩
    장단 점
    1.react 장점
    React Native 는 휴대 전화 에 네 이 티 브 애플 리 케 이 션 을 만 들 수 있 으 며,React 는 이 분야 에서 선 두 를 달리 고 있다.자 바스 크 립 트,CSS,HTML 을 사용 하여 네 이 티 브 모 바 일 애플 리 케 이 션 을 만 드 는 것 은 중요 한 혁신 입 니 다.Vue 커 뮤 니 티 는 아 리 와 합작 하여 Vue 버 전의 React Native-Weex 를 개발 하 는 것 도 좋 지만 개발 상태 에 있 고 실제 프로젝트 의 검증 을 거치 지 않 았 다.
    a.대형 응용 프로젝트 구축
    Vue 와 React 를 동시에 사용 하 는 간단 한 프로그램 은 개발 자의 잠재의식 에서 Vue 를 더욱 선 호 할 수 있 습 니 다.템 플 릿 기반 애플 리 케 이 션 이 첫눈 에 이해 하기 쉽 고 빠르게 달 릴 수 있 기 때문이다.
    그러나 이런 혜택 이 도 입 된 기술 채 는 응용 이 더 큰 규모 로 확대 되 는 것 을 막 을 수 있다.
    템 플 릿 은 알 아차 리 기 어 려 운 런 타임 오류 가 발생 하기 쉬 우 며 테스트,재 구성,분해 도 어렵다.
    이에 비해 자 바스 크 립 트 템 플 릿 은 분해 성과 건조(DRY)코드 를 잘 갖 춘 구성 요소 로 구성 할 수 있 으 며,건조 코드 의 중용 성과 테스트 가능성 이 더 좋다.
    Vue 에 도 구성 요소 시스템 과 렌 더 링 함수 가 있 지만 React 의 렌 더 링 시스템 은 설정 성 이 더욱 강하 고 얕 은(shallow)렌 더 링 과 같은 특성 이 있 으 며 React 의 테스트 도구 와 결합 하여 사용 하면 코드 의 테스트 가능성 과 유지 가능성 이 더욱 좋 습 니 다.
    이 동시에 React 의 immutable 응용 상 태 는 간결 하지 않 을 수 있 지만 대형 응용 에서 의미 가 매우 크다.투명 성과 테스트 가능성 이 대형 프로젝트 에서 매우 중요 하기 때문이다.
    b.웹 엔 드 와 네 이 티 브 앱 에 동시에 적용
    React Native 는 자 바스 크 립 트 를 사용 해 모 바 일 애플 리 케 이 션(iOS,Android)을 구축 하 는 라 이브 러 리 다.React.js 와 마찬가지 로 웹 구성 요 소 를 사용 하지 않 고 네 이 티 브 구성 요 소 를 사용 합 니 다.만약 당신 이 React.js 를 배 웠 다 면,곧 React Native 에 착수 할 수 있 을 것 이 고,반대로 도 마찬가지 입 니 다.개발 자가 지식 과 도구 한 세트 만 있 으 면 웹 애플 리 케 이 션 과 모 바 일 애플 리 케 이 션 을 개발 할 수 있다 는 의미 다.웹 개발 과 모 바 일 개발 을 동시에 하고 싶다 면 React 는 큰 선물 을 준비 했다.아 리 의 Weex 도 크로스 플랫폼 UI 프로젝트 로 현재 Vue 를 영감 으로 똑 같은 문법 을 많이 사용 하 는 동시에 미래 에 Vue 를 완전히 통합 할 계획 이지 만 집적 시간 과 디 테 일 은 아직 밝 혀 지지 않 았 다.Vue 는 HTML 템 플 릿 을 디자인 의 핵심 부분 으로 하고 기 존 특성 상 사용자 정의 렌 더 링 을 지원 하지 않 기 때문에 현재 Vue.js 의 크로스 플랫폼 능력 이 React 와 React Native 처럼 강하 다 는 것 을 알 기 어렵다.
    2.vue 장점
    a.템 플 릿 구축 응용 기대
    	Vue         markup  HTML   。            Angular   mustache  ,   (   HTML  )         。 
    

    이에 비해 React 응용 프로그램 은 템 플 릿 을 사용 하지 않 고 개발 자 에 게 JSX 를 통 해 JavaScript 에서 DOM 을 만 들 도록 요구 합 니 다.
    b.가능 한 한 작고 빠 른 응용 을 기대 합 니 다.
    프로그램의 상태 가 바 뀌 면 React 와 Vue 는 가상 DOM 을 구축 하고 실제 DOM 에 동기 화 합 니 다.둘 다 각자 의 방법 으로 이 과정 을 최적화 시 켰 다.Vue 핵심 개발 자가 Benchmark 테스트 를 제 공 했 는데 Vue 의 렌 더 링 시스템 이 React 보다 빠 른 것 을 알 수 있 습 니 다.테스트 방법 은 10000 개 항목 의 목록 을 100 번 렌 더 링 하 는 것 입 니 다.
    실 용적 인 관점 에서 볼 때 이런 벤 치 마크 는 가장자리 상황 과 만 관련 이 있 고 대부분의 응용 프로그램 에서 이런 조작 을 자주 하지 않 기 때문에 이것 은 중요 한 비교 점 으로 여 겨 져 서 는 안 된다.
    그러나 페이지 크기 는 모든 항목 과 관련 된 것 으로 Vue 가 다시 앞서 고 있 으 며 현재 버 전 압축 후 25.6KB 에 불과 하 다.
    React 가 같은 기능 을 수행 하려 면 React DOM(37.4KB)과 React with Addon 라 이브 러 리(11.4KB)가 필요 하 며,총 44.8KB 로 Vue 의 거의 두 배 크다.
    두 배의 부 피 는 결코 두 배의 기능 을 가 져 올 수 없다.
    종합 적 으로 고려 하 다
    템 플 릿 으로 애플 리 케 이 션 을 만 드 는 것 을 좋아한다 면 Vue 를 사용 하 십시오.
    만약 당신 이 간단 하고 쓸 수 있 는 것 을 좋아한다 면,Vue 를 사용 하 세 요.
    애플 리 케 이 션 이 가능 한 한 작고 빠 른 것 이 필요 하 다 면 Vue 를 사용 하 세 요.
    대형 프로그램 을 만 들 계획 이 라면 React 를 사용 하 십시오.
    웹 엔 드 와 네 이 티 브 앱 에 동시에 적용 되 는 프레임 워 크 를 원한 다 면 React 를 선택 하 십시오.
    가장 큰 생태 권 을 원한 다 면 React 를 사용 하 세 요.
    기 존 애플 리 케 이 션 을 새로운 자 바스 크 립 트 프레임 워 크 로 업그레이드 하려 면 Vue 를 선택 하 는 것 이 좋 습 니 다.

    좋은 웹페이지 즐겨찾기