在Angularjs项目中，React + webpack渲染列表缓慢

Question

我只是使用Webpack优化Angular项目来构建和ReactJs渲染。但是在我的项目中，React慢慢渲染一个列表，尽管测试非常快： AngularJs + ReactJs测试：http://plnkr.co/edit/6zfFXU?p=preview

这是我的存储库： https://github.com/datnq201088/angular-webpack-react

我的列表组件：

import React from 'react';

export default React.createClass({
propTypes: {
    data : React.PropTypes.array.isRequired
},
render: function() {
    console.log('render');
    var i = 0;
    var rows = this.props.data.map(function(datum){
        i++;
        var clickHandler = function (e) {
            console.log("Still in reactJs!");
        }
        return (
             <tr key={i} ngClick="{clickHandler}">
                <td> {datum[0]} </td>
                <td> {datum[1]} </td>
                <td> {datum[2]} </td>
                <td> {datum[3]} </td>
                <td> {datum[4]} </td>
             </tr>
        );

    });
    console.log('finished render');
    return (
        <table>
         {rows}
        </table>
    );
}
});

我的指示：

import angular from 'angular';
import Mylist from './components/mylist';
import React from 'react';

function myListComponent() {
return {
    restrict: 'E',
    scope: {
        data: '='
    },
    template: '<div></div>',
    link: function(scope, el, attrs) {
            scope.$watchCollection('data', function(newValue,           oldValue) {
                console.log('changed');
                if (!newValue.length)
                    return;
                React.render(
                    <Mylist data={newValue} />,
                    el[0]
                );
                console.log('done!');
            });
        }
    }
}

export default angular.module('home.directives', [])
    .directive('myList', myListComponent);