작은 API를 고려할 때 React의 파일 크기가 왜 그렇게 큰가요?

숫자는 다음과 같습니다.

• min + gzip 26k
• gzip 90k
• 오리지널 450 + k

그리고 React는 문서에 많은 기능이 없습니다. 왜 그렇게 큽니까?

나는 그것이 경량 DOM의 구현이라고 느낍니다. 하지만 확신하고 싶습니다.

React는 꽤 많이합니다! React의 가장 눈에 띄지 않는 부분은 아마도 이벤트 시스템 일 것입니다. React는 자체 이벤트 디스패치 및 버블 링을 구현할뿐만 아니라 브라우저 전반에 걸쳐 공통 이벤트를 정규화하므로 걱정할 필요가 없습니다. 예를 들어, SelectEventPlugin 은 onSelect모든 브라우저에서 동일한 방식으로 작동 하는 이벤트를 제공하는 기본 제공 이벤트 "플러그인"입니다 .

가상 DOM의 구현뿐만 아니라 코드의 상당한 금액을 가지고 간다; 성능 최적화에 많은 노력이 들기 때문에 축소되지 않은 버전에는 렌더링 성능을 측정하기위한 도구 인 ReactPerf가 포함되어 있습니다. DOM을 업데이트 할 때 React는 입력 선택을 유지하고 현재 스크롤 위치를 동일하게 유지하는 것과 같은 편리한 작업도 수행합니다.

React에는 몇 가지 다른 트릭이 있습니다. 가장 멋진 것 중 하나는 브라우저 환경이 없더라도 컴포넌트를 HTML 문자열로 렌더링하는 것을 완벽하게 지원하므로 JS가로드되기 전에도 작동하는 페이지를 보낼 수 있다는 것입니다.

React를 무엇과 비교하고 있습니까? react-15.0.2.min.js입니다 43k (gzipped)만, jQuery를이 33K 동안은 ember-2.6.0.prod.js입니다 363k (also gzipped). 분명히 이러한 프레임 워크는 똑같은 작업을 수행하지는 않지만 중복되는 부분이 많기 때문에 비교가 합리적이라고 생각합니다.

다운로드 크기가 걱정된다면 JS 코드가 이에 기여하는 것에 대해 너무 걱정하지 않을 것입니다. 현재 내 Stack Overflow 페이지 오른쪽에 표시되는 광고는 다음과 같습니다.

다운로드 크기는 95k입니다. (성능에 대해 걱정 했더라도) 일반적으로 더 유리한 수정해야 할 다른 성능 관련 사항이 많기 때문에 페이지에 이와 같은 이미지를 포함하는 것에 대해 두 번 생각하지 않습니다.

요컨대, React가 그렇게 크지 않다고 생각하며, 그 크기는 당신을 돕기 위해하는 많은 작은 일들에서 비롯됩니다. React의 코드가 작아야하는 이유로 React의 작은 API를 언급하지만 더 좋은 질문은 "React의 API가 당신을 위해하는 모든 일을 감안할 때 어떻게 그렇게 간단 할 수 있습니까?"입니다.

… 그러나 그것은 완전히 별개의 질문입니다. :) 내가 귀하의 질문에 답했으면 좋겠습니다. 그렇지 않으면 확장하게되어 기쁩니다.

몇 가지 생각 .. 크기에 대해서도 똑같은 고민이 있었는데, 사용 후 농담없이 5MB라면 사용하겠다. 그것은 단지 좋은 일입니다. 즉, 가능한 한 다른 라이브러리에 대한 종속성을 줄이기로 결정했습니다. 두 가지를 위해 jquery를 사용했습니다. ajax와 자동 ajax 응답 및 로그인 후 토큰이 응답에있을 때 처리 할 요청 처리 (beforeSend 등)를 사용한 다음 모든 ajax 요청이 이전에 Authorization 헤더에 추가했는지 확인합니다. 배상. 나는 이것을 아주 작은 간단한 네이티브 자바 스크립트로 대체했습니다. 잘 작동합니다. 또한 _underscore를 사용하려고했습니다. 나는 그것을 더 작고 더 빠른 lodash로 대체했지만 현재는 사용하지 않고 있으므로 완전히 제거 할 수 있습니다.

다음은 jquery를 통해 네이티브 JS를 사용하는 몇 가지 대안이있는 Google의 많은 기사 중 하나입니다.

http://www.sitepoint.com/jquery-vs-raw-javascript-1-dom-forms/