오픈소스 자바스크립트 라이브러리 '리액트 파이버', 베타 단계 진입
OSS
게시글 작성 시각 2017-08-04 00:21:48
2017년 8월 3일 (목)
ⓒ CIO Korea, Paul Krill | InfoWorld
페이스북의 오픈소스 자바스크립트 UI 라이브러리 최신 버전인 '리액트 16(React 16)'이 베타 단계로 진입했다. 코드명 '파이버(Fiber)'로 불리는 이번 버전에서는 애니메이션과 레이아웃, 제스처 지원이 강화됐다.
NPM 모듈로 공개된 이 초기 베타 버전은 기존 앱과 호환성을 강화하는 데 초점을 맞췄다. 페이스북은 버전 16이 네이티브와 비슷한 성능을 제공한다고 주장했다. 파이버에는 다음과 같은 신기능에 추가됐다.
- 비동기 컴포넌트 렌더링을 통해 성능 향상
- 렌더 어레이 반환과 컴포넌트 오류 복구, 에러 스택 추적 가독성 개선
- 개선을 방해했던 내부 추상화 제거
페이스북은 리액트 16.x 개발이 끝나면 업그레이드에 대해 사전 동의를 받을 예정이다. 리액트 16.0 버전을 사용했다고 당장 앱을 획기적으로 빨라지지는 않는다. 리액트의 성능 향상은 반복적이고 점진적으로 이뤄진다고 페이스북은 설명했다. 베타 버전과 함께 페이스북은 개발자의 반응을 가장 기대하고 있다. 업체는 "15.x와 16.x 버전 사이의 성능 차이에 대한 개발자의 반응을 확인하는 데 특히 관심이 많다"라고 말했다.
16 버전은 맵과 셋트 컬렉션 타임에 의존하므로, 기존 브라우저와 기기는 이를 네이티브로 지원하지 않을 수 있다. 개발자는 앱 내에 코어-js나 바벨-폴리필 같은 폴리필(polyfill) 설치를 고려해야 한다. 리액트 16의 서버 랜더러는 전면 재개발돼 스트리밍 모드를 지원한다.
베타에서 변화된 점 중에는 새로운 오류 처리 기능이 포함됐다. 컴포넌트 트리의 런타인 오류를 잡아내는 '에러 바운더리(error boundaries)' 컴포넌트가 추가돼 이를 기록하고 펄백 UI를 보여준다. 기존에는 런타임 에러가 리액트를 장애 상태로 만들어 알 수 없는 경고를 보여주곤 했다.
스케줄링과 라이프사이클에도 변화가 많다. 이제 ReactDOM.render()과 ReactDOM.unstable_renderSubtreeIntoContainer() 메소드는 라이프사이클 메소드로부터 호출될 때 'null'을 반환한다. 패키징 작업을 위해 react/lib/*나 react-dom/lib/* 명령을 사용할 필요도 없어졌다. 애드온 관련해서는 react-addons-perf 성능 툴이 더는 리액트 16 내에서 실행되지 않는다. 다음 버전에서 비슷한 기능이 지원될 가능성도 있다.
NPM 모듈로 공개된 이 초기 베타 버전은 기존 앱과 호환성을 강화하는 데 초점을 맞췄다. 페이스북은 버전 16이 네이티브와 비슷한 성능을 제공한다고 주장했다. 파이버에는 다음과 같은 신기능에 추가됐다.
- 비동기 컴포넌트 렌더링을 통해 성능 향상
- 렌더 어레이 반환과 컴포넌트 오류 복구, 에러 스택 추적 가독성 개선
- 개선을 방해했던 내부 추상화 제거
페이스북은 리액트 16.x 개발이 끝나면 업그레이드에 대해 사전 동의를 받을 예정이다. 리액트 16.0 버전을 사용했다고 당장 앱을 획기적으로 빨라지지는 않는다. 리액트의 성능 향상은 반복적이고 점진적으로 이뤄진다고 페이스북은 설명했다. 베타 버전과 함께 페이스북은 개발자의 반응을 가장 기대하고 있다. 업체는 "15.x와 16.x 버전 사이의 성능 차이에 대한 개발자의 반응을 확인하는 데 특히 관심이 많다"라고 말했다.
16 버전은 맵과 셋트 컬렉션 타임에 의존하므로, 기존 브라우저와 기기는 이를 네이티브로 지원하지 않을 수 있다. 개발자는 앱 내에 코어-js나 바벨-폴리필 같은 폴리필(polyfill) 설치를 고려해야 한다. 리액트 16의 서버 랜더러는 전면 재개발돼 스트리밍 모드를 지원한다.
베타에서 변화된 점 중에는 새로운 오류 처리 기능이 포함됐다. 컴포넌트 트리의 런타인 오류를 잡아내는 '에러 바운더리(error boundaries)' 컴포넌트가 추가돼 이를 기록하고 펄백 UI를 보여준다. 기존에는 런타임 에러가 리액트를 장애 상태로 만들어 알 수 없는 경고를 보여주곤 했다.
스케줄링과 라이프사이클에도 변화가 많다. 이제 ReactDOM.render()과 ReactDOM.unstable_renderSubtreeIntoContainer() 메소드는 라이프사이클 메소드로부터 호출될 때 'null'을 반환한다. 패키징 작업을 위해 react/lib/*나 react-dom/lib/* 명령을 사용할 필요도 없어졌다. 애드온 관련해서는 react-addons-perf 성능 툴이 더는 리액트 16 내에서 실행되지 않는다. 다음 버전에서 비슷한 기능이 지원될 가능성도 있다.
※ 본 내용은 한국IDG(주)(http://www.ciokorea.com)의 저작권 동의에 의해 공유되고 있습니다.
Copyright ⓒCIO. 무단전재 및 재배포 금지
[원문출처 : http://www.ciokorea.com/news/35093]
번호 | 제목 | 조회수 | 작성 |
---|---|---|---|
공지 | [Open UP 활용가이드] 공개SW 활용 및 개발, 창업, 교육 "Open UP을 활용하세요" | 435680 | 2020-10-27 |
공지 | [Open UP 소개] 공개SW 개발·공유·활용 원스톱 지원 Open UP이 함께합니다 | 424607 | 2020-10-27 |
7134 | 코딩교육 열풍 속, 보다 쉽고 안전한 코딩교구 ‘빅보드’ 등장 | 4481 | 2017-08-04 |
7133 | 윈도10 속 리눅스, 베타 딱지 뗀다 | 5246 | 2017-08-04 |
7132 | [포럼] `자아실현 기술`이 집단지능 만든다 | 5001 | 2017-08-04 |
7131 | IFA 2017 모바일 키워드는 '인공지능(AI)' | 4818 | 2017-08-04 |
7130 | 오픈소스 자바스크립트 라이브러리 '리액트 파이버', 베타 단계 진입 | 4615 | 2017-08-04 |
7129 | 2017년 상반기, 랜섬웨어 위협 쓰나미 휩쓸다 | 4928 | 2017-08-03 |
7128 | 애플·구글·MS·모질라의 '어도비 플래시 제거' 로드맵 | 4975 | 2017-08-03 |
7127 | 은행간 지급 - 정산업무에도 블록체인 도입 추진 | 5672 | 2017-08-03 |
7126 | “컨테이너 주도권 노린다” 마이크로소프트 애저 컨테이너 인스턴스의 이해 | 4706 | 2017-08-03 |
7125 | 데이터 분석과 인공지능 개발? 구글 클라우드에서 하시라 | 5381 | 2017-08-03 |
0개 댓글