React 0.14 splitting 패키지 정리

React 0.14 beta 돌면서 가장 큰 변화가 react와 react-dom 패키지 분리. npm에서 따로 받아야 함.

npm install --save react@0.14.0-beta3 react-dom@0.14.0-beta3

기존:

var React = require('react');
React.render(<App/>, document.getElementById('root'));

0.14:

var React = require('react');
var ReactDOM = require('react-dom');
ReactDOM.render(<App/>, document.getElementById('root'));

왜 쪼갰냐? 서버사이드(Node)랑 클라이언트(브라우저)에서 쓰는 부분이 달라서. React Native 등장으로 DOM에 묶인 코드를 코어에서 분리하는 흐름. 앞으로 react-art, react-canvas 같은 렌더러들이 같은 방식으로 붙을 것.

바뀐 것들 정리:

• React.findDOMNode → ReactDOM.findDOMNode
• React.unmountComponentAtNode → ReactDOM.unmountComponentAtNode
• PropTypes 여전히 React에 있음 (아직)
• stateless functional component 처음 지원. const MyComp = (props) => <div>{props.name}</div>
• ref callback 형태 등장. string ref는 deprecated 예정

우리 회사 프로젝트는 0.13에서 쓰던게 꽤 있는데 migration 다 해봤다. 거의 찾아바꾸기 수준. stateless functional component는 앞으로 dumb component 쪽에 적극 도입할 계획. 성능상 최적화 여지도 있고 (추후 버전에서 별도 optimization 예정이라고 함).

이번 release는 중간 정리 성격. 0.13에서 0.14 넘어가는 것 자체는 크게 고통스럽진 않았음.