React vs ReactDOM?

Sou um pouco novo para reagir. Vejo que precisamos importar duas coisas para começar Reacte ReactDOMalguém pode explicar a diferença. Estou lendo a documentação do React , mas não diz.

O React e o ReactDOM foram divididos apenas recentemente em duas bibliotecas diferentes. Antes da v0.14, todas as funcionalidades do ReactDOM faziam parte do React. Isso pode ser uma fonte de confusão, pois qualquer documentação um pouco datada não menciona a distinção React / ReactDOM.

Como o nome indica, ReactDOM é a cola entre o React e o DOM. Freqüentemente, você o utilizará apenas para uma única coisa: montar com ReactDOM.render(). Outro recurso útil do ReactDOM é o ReactDOM.findDOMNode()qual você pode usar para obter acesso direto a um elemento DOM. (Algo que você deve usar com moderação nos aplicativos React, mas pode ser necessário.) Se seu aplicativo for "isomórfico", você também usariaReactDOM.renderToString() no seu código de back-end.

Para todo o resto, há React. Você usa o React para definir e criar seus elementos, para ganchos do ciclo de vida, etc., isto é, as entranhas de um aplicativo React.

A razão pela qual o React e o ReactDOM foram divididos em duas bibliotecas foi devido à chegada do React Native. O React contém a funcionalidade utilizada em aplicativos da web e móveis. A funcionalidade ReactDOM é utilizada apenas em aplicativos da web. [ ATUALIZAÇÃO: Após mais pesquisas, fica claro que minha ignorância sobre o React Native está mostrando. Ter o pacote React comum à Web e aos dispositivos móveis parece ser mais uma aspiração do que uma realidade agora. Atualmente, o React Native é um pacote totalmente diferente.]

Veja a postagem do blog que anuncia a versão v0.14: https://facebook.github.io/react/blog/2015/10/07/react-v0.14.html

No anúncio da versão beta do React v0.14 .

Quando olhamos para pacotes como react-native, react-art, react-canvas, e react-three, tornou-se claro que a beleza ea essência da Reagir não tem nada a ver com navegadores ou o DOM.

Para tornar isso mais claro e facilitar a criação de mais ambientes nos quais o React pode renderizar, estamos dividindo o pacote principal do react em dois: react e react-dom.

Fundamentalmente, a idéia do React não tem nada a ver com navegadores, eles são um dos muitos alvos para renderizar árvores de componentes. O pacote ReactDOM permitiu aos desenvolvedores remover qualquer código não essencial do pacote React e movê-lo para um repositório mais apropriado.

O reactpacote contém React.createElement, React.createClasse React.Component, React.PropTypes, React.Children, e os outros ajudantes relacionadas com elementos e classes de componentes. Nós pensamos neles como os auxiliares isomórficos ou universais que você precisa para construir componentes.

O react-dompacote contém ReactDOM.render, ReactDOM.unmountComponentAtNodee ReactDOM.findDOMNode, e em react-dom/serverque temos suporte de renderização do lado do servidor com ReactDOMServer.renderToStringe ReactDOMServer.renderToStaticMarkup.

Esses dois parágrafos explicam de onde os métodos principais da API foram v0.13finalizados.

Antes da v0.14, eles faziam parte do arquivo principal do ReactJs, mas, como em alguns casos, talvez não precisemos dos dois, eles os separam e ele começa na versão 0.14. Dessa forma, se precisarmos de apenas um deles, nosso aplicativo será menor devido a usando apenas um deles:

var React = require('react'); /* importing react */
var ReactDOM = require('react-dom'); /* importing react-dom */

var MyComponent = React.createClass({
  render: function() {
    return <div>Hello World</div>;
  }
});

ReactDOM.render(<MyComponent />, node);

O pacote React contém: React.createElement, React.createClass, React.Component, React.PropTypes, React.Children

React-dom pacote contém: ReactDOM.render, ReactDOM.unmountComponentAtNode, ReactDOM.findDOMNode e react-dom / server que inclui: ReactDOMServer.renderToString e ReactDOMServer.renderToStaticMarkup.

O módulo ReactDOM expõe métodos específicos do DOM, enquanto o React possui as principais ferramentas que devem ser compartilhadas pelo React em diferentes plataformas (por exemplo, React Native).

http://facebook.github.io/react/docs/tutorial.html

Parece que eles separaram o React em reacte react-dompacotes, para que você não precise usar a parte relacionada ao DOM para projetos nos quais gostaria de usá-la em casos não específicos do DOM, como aqui https: // github.com/Flipboard/react-canvas para onde eles importam

var React = require('react');
var ReactCanvas = require('react-canvas');

como você pode ver. Sem react-dom.

Para ser mais conciso, react é para os componentes e react-dom é para renderizar os componentes no DOM. 'react-dom' atua como uma cola entre componentes e DOM. Você usará o método render () do react-dom para renderizar componentes no DOM e isso é tudo o que você precisa saber quando começar com ele.

Ele react packagecontém os react sourcecomponentes for, state, props e todo o código que é reagido.

O react-dompacote como o nome indica é o glue between React and the DOM. Muitas vezes, você só vai usá-lo para uma única coisa: mounting your application to the index.html file with ReactDOM.render().

Por que separá-los?

O reasonReact e o ReactDOM foram divididos em duas bibliotecas devido à chegada de React Native (A react platform for mobile development).