Reactjs: Czy korzystanie z komponentów React przy wykorzystaniu normalnych funkcji ma swoje zalety? są jakieś wady (:

Question

Biorąc za przykład this sample z docs React.js

var Avatar = React.createClass({ 
    render: function() { 
    return (
     <div> 
     <ProfilePic username={this.props.username} /> 
     <ProfileLink username={this.props.username} /> 
     </div> 
    ); 
    } 
}); 

var ProfilePic = React.createClass({ 
    render: function() { 
    return (
     <img src={'http://graph.facebook.com/' + this.props.username + '/picture'} /> 
    ); 
    } 
}); 

var ProfileLink = React.createClass({ 
    render: function() { 
    return (
     <a href={'http://www.facebook.com/' + this.props.username}> 
     {this.props.username} 
     </a> 
    ); 
    } 
}); 

React.render(
    <Avatar username="pwh" />, 
    document.getElementById('example') 
); 

W przypadkach takich jak ten, z komponentów bez państwa, a jeśli jestem nie zamiar użyć JSX wydajności lub w inny sposób) do używania funkcji zamiast tworzenia komponentów? IE, redukując je do czegoś takiego (napisany w ES6)

var { a, div, img } = React.DOM; 

var Avatar = (username) => 
    div({}, ProfilePic(username), ProfileLink(username)); 

var ProfilePic = (username) => 
    img({src: `http://graph.facebook.com/${username}/picture`}); 

var ProfileLink = (username) => 
    a({href: `http://www.facebook.com/${username}`}, username); 

React.render(Avatar(username), document.getElementById('example')) 

Answer 1

Jeśli nie używasz JSX, i nie potrzebują żadnej z funkcji run-time z klas bazowych (jak componentDidMount, etc), a następnie nie ma żadnej przewagi, aby tworzyć klasy niepotrzebnie, a w rzeczywistości będzie ono (nieco) bardziej efektywne ogólnie.

Tworząc konkretne (ale bardzo proste) funkcje opakowania, takie jak w przypadku Avatar, poprawia to czytelność kodu. Jednak jeśli kiedykolwiek zaczniesz używać JSX, musisz przełączyć się na createClass, aby właściwości zostały poprawnie przekazane (ponieważ początkowe właściwości nie są przekazywane do funkcji konstruktora, ponieważ są one w twoim kodzie).