Data props diffing in a React component and re-initialize a cell of jQuery object without re-initializing jQuery grid object in the componentDidUpdate method (and without re-rendering the whole React component). Code snippet in blog post http://andrejgajdos.com/how-to-avoid-refactoring-in-your-first-react-application/

DataGrid.jsx

let diff = require('immutablediff');

shouldComponentUpdate(nextProps, nextState) {
    let propsDiff = diff(this.props.data, nextProps.data);
    if (propsDiff.size === 1) {
        let operation = propsDiff.get(0).get("op");
        let replacedObj = propsDiff.get(0).get("value");
        switch (operation) {
            case "replace":
                if (Immutable.Map.isMap(replacedObj)) {
                    let editedObj = {};
                    let xCoordinate;
                    let yCoordinate;
                    for (let entry of replacedObj.entries()) {
                        if (entry[0] === 'x-coordinate'){
                            xCoordinate = entry[1];
                        }
                        if (entry[0] === 'y-coordinate'){
                            yCoordinate = entry[1];
                        }
                        editedObj[entry[0]] = entry[1];
                    }
                    $(ReactDOM.findDOMNode(this.refs.dataGrid))
                    .updateCellOnCoordinate(xCoordinate, yCoordinate, editedObj);
                    return false;
                }
                break;
            case "remove":
                ...
                break;
            case "add":
                ...
                break;
            default:
                return true;
        }
    }
    return true;
}