Skip to content

Commit

Permalink
Use React.PureComponent instead of shallowCompare
Browse files Browse the repository at this point in the history
  • Loading branch information
cheton committed Apr 20, 2017
1 parent c3ffa47 commit c1083b3
Show file tree
Hide file tree
Showing 5 changed files with 19 additions and 69 deletions.
67 changes: 10 additions & 57 deletions docs/bundle.js
Original file line number Diff line number Diff line change
Expand Up @@ -6744,42 +6744,6 @@ var ReactPropTypesSecret = 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED';
module.exports = ReactPropTypesSecret;


/***/ }),

/***/ "../node_modules/react-addons-shallow-compare/index.js":
/***/ (function(module, exports, __webpack_require__) {

"use strict";
/**
* Copyright 2013-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*
* @providesModule shallowCompare
*/



var shallowEqual = __webpack_require__("../node_modules/fbjs/lib/shallowEqual.js");

/**
* Does a shallow comparison for props and state.
* See ReactComponentWithPureRenderMixin
* See also https://facebook.github.io/react/docs/shallow-compare.html
*/
function shallowCompare(instance, nextProps, nextState) {
return (
!shallowEqual(instance.props, nextProps) ||
!shallowEqual(instance.state, nextState)
);
}

module.exports = shallowCompare;


/***/ }),

/***/ "../node_modules/react-dom/index.js":
Expand Down Expand Up @@ -26795,7 +26759,6 @@ module.exports = function(module) {
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = undefined;

var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

Expand All @@ -26813,10 +26776,6 @@ var _react = __webpack_require__("../node_modules/react/react.js");

var _react2 = _interopRequireDefault(_react);

var _reactAddonsShallowCompare = __webpack_require__("../node_modules/react-addons-shallow-compare/index.js");

var _reactAddonsShallowCompare2 = _interopRequireDefault(_reactAddonsShallowCompare);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
Expand All @@ -26825,21 +26784,16 @@ function _possibleConstructorReturn(self, call) { if (!self) { throw new Referen

function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

var _default = (_temp = _class = function (_Component) {
_inherits(_default, _Component);
var Interpolate = (_temp = _class = function (_PureComponent) {
_inherits(Interpolate, _PureComponent);

function _default() {
_classCallCheck(this, _default);
function Interpolate() {
_classCallCheck(this, Interpolate);

return _possibleConstructorReturn(this, (_default.__proto__ || Object.getPrototypeOf(_default)).apply(this, arguments));
return _possibleConstructorReturn(this, (Interpolate.__proto__ || Object.getPrototypeOf(Interpolate)).apply(this, arguments));
}

_createClass(_default, [{
key: 'shouldComponentUpdate',
value: function shouldComponentUpdate(nextProps, nextState) {
return (0, _reactAddonsShallowCompare2.default)(this, nextProps, nextState);
}
}, {
_createClass(Interpolate, [{
key: 'render',
value: function render() {
var _this2 = this;
Expand Down Expand Up @@ -26889,8 +26843,8 @@ var _default = (_temp = _class = function (_Component) {
}
}]);

return _default;
}(_react.Component), _class.propTypes = {
return Interpolate;
}(_react.PureComponent), _class.propTypes = {
format: _propTypes2.default.string,
parent: _propTypes2.default.string,
prefix: _propTypes2.default.string,
Expand All @@ -26901,8 +26855,7 @@ var _default = (_temp = _class = function (_Component) {
prefix: '{{',
suffix: '}}'
}, _temp);

exports.default = _default;
exports.default = Interpolate;

/***/ }),

Expand Down Expand Up @@ -27044,4 +26997,4 @@ _reactDom2.default.render(_react2.default.createElement(App, null), document.get
/***/ })

/******/ });
//# sourceMappingURL=bundle.js.map?83b13e4b8a3e575335a5
//# sourceMappingURL=bundle.js.map?bef04690efc412f8c4b3
2 changes: 1 addition & 1 deletion docs/bundle.js.map

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion docs/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -41,5 +41,5 @@
</div>
</nav>
<div id="container"></div>
<script type="text/javascript" src="bundle.js?83b13e4b8a3e575335a5"></script></body>
<script type="text/javascript" src="bundle.js?bef04690efc412f8c4b3"></script></body>
</html>
7 changes: 3 additions & 4 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@trendmicro/react-interpolate",
"version": "0.5.2",
"version": "0.5.3",
"description": "A React component that renders elements into a format string containing replacement fields.",
"main": "lib/index.js",
"files": [
Expand Down Expand Up @@ -45,11 +45,10 @@
"react": "^0.14.0 || ^15.0.0"
},
"dependencies": {
"prop-types": "^15.5.8",
"react-addons-shallow-compare": "^0.14.0 || ^15.0.0"
"prop-types": "^15.5.8"
},
"devDependencies": {
"@trendmicro/react-buttons": "~1.0.3",
"@trendmicro/react-buttons": "~1.0.4",
"babel-cli": "~6.24.0",
"babel-core": "~6.24.0",
"babel-eslint": "~7.2.2",
Expand Down
10 changes: 4 additions & 6 deletions src/Interpolate.jsx
Original file line number Diff line number Diff line change
@@ -1,9 +1,8 @@
import omit from 'lodash/omit';
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import shallowCompare from 'react-addons-shallow-compare';
import React, { PureComponent } from 'react';

export default class extends Component {
class Interpolate extends PureComponent {
static propTypes = {
format: PropTypes.string,
parent: PropTypes.string,
Expand All @@ -20,9 +19,6 @@ export default class extends Component {
suffix: '}}'
};

shouldComponentUpdate(nextProps, nextState) {
return shallowCompare(this, nextProps, nextState);
}
render() {
const { parent, prefix, suffix, replacement } = this.props;
const REGEXP = new RegExp(prefix + '(.+?)' + suffix);
Expand Down Expand Up @@ -63,3 +59,5 @@ export default class extends Component {
return React.createElement.apply(this, [parent, props].concat(children));
}
}

export default Interpolate;

0 comments on commit c1083b3

Please sign in to comment.