Use React.PureComponent instead of shallowCompare

trendmicro-frontend · Apr 20, 2017 · 3afc543 · 3afc543
1 parent 37f9fab
commit 3afc543
Show file tree

Hide file tree

Showing 8 changed files with 19 additions and 47 deletions.
diff --git a/dist/react-breadcrumbs.css b/dist/react-breadcrumbs.css
diff --git a/dist/react-breadcrumbs.min.css b/dist/react-breadcrumbs.min.css
diff --git a/docs/bundle.js b/docs/bundle.js
@@ -25067,7 +25067,7 @@ module.exports = g;
 
 module.exports = {
 	"name": "@trendmicro/react-breadcrumbs",
-	"version": "0.5.2",
+	"version": "0.5.3",
 	"description": "Trend Micro Components: React Breadcrumbs",
 	"main": "lib/index.js",
 	"files": [
@@ -25116,8 +25116,7 @@ module.exports = {
 	},
 	"dependencies": {
 		"classnames": "^2.2.5",
-		"prop-types": "^15.5.8",
-		"react-addons-shallow-compare": "^0.14.0 || ^15.0.0"
+		"prop-types": "^15.5.8"
 	},
 	"devDependencies": {
 		"@trendmicro/react-anchor": "~0.5.4",
@@ -25189,10 +25188,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);
-
 var _index = __webpack_require__("../src/index.styl");
 
 var _index2 = _interopRequireDefault(_index);
@@ -25207,8 +25202,8 @@ 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 Breadcrumbs = (_temp = _class = function (_Component) {
-    _inherits(Breadcrumbs, _Component);
+var Breadcrumbs = (_temp = _class = function (_PureComponent) {
+    _inherits(Breadcrumbs, _PureComponent);
 
     function Breadcrumbs() {
         _classCallCheck(this, Breadcrumbs);
@@ -25217,11 +25212,6 @@ var Breadcrumbs = (_temp = _class = function (_Component) {
     }
 
     _createClass(Breadcrumbs, [{
-        key: 'shouldComponentUpdate',
-        value: function shouldComponentUpdate(nextProps, nextState) {
-            return (0, _reactAddonsShallowCompare2.default)(this, nextProps, nextState);
-        }
-    }, {
         key: 'render',
         value: function render() {
             var _props = this.props,
@@ -25258,7 +25248,7 @@ var Breadcrumbs = (_temp = _class = function (_Component) {
     }]);
 
     return Breadcrumbs;
-}(_react.Component), _class.propTypes = {
+}(_react.PureComponent), _class.propTypes = {
     showLineSeparator: _propTypes2.default.bool
 }, _class.defaultProps = {
     showLineSeparator: false
@@ -25295,10 +25285,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);
-
 var _index = __webpack_require__("../src/index.styl");
 
 var _index2 = _interopRequireDefault(_index);
@@ -25315,8 +25301,8 @@ 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 BreadcrumbsItem = (_temp = _class = function (_Component) {
-    _inherits(BreadcrumbsItem, _Component);
+var BreadcrumbsItem = (_temp = _class = function (_PureComponent) {
+    _inherits(BreadcrumbsItem, _PureComponent);
 
     function BreadcrumbsItem() {
         _classCallCheck(this, BreadcrumbsItem);
@@ -25325,11 +25311,6 @@ var BreadcrumbsItem = (_temp = _class = function (_Component) {
     }
 
     _createClass(BreadcrumbsItem, [{
-        key: 'shouldComponentUpdate',
-        value: function shouldComponentUpdate(nextProps, nextState) {
-            return (0, _reactAddonsShallowCompare2.default)(this, nextProps, nextState);
-        }
-    }, {
         key: 'render',
         value: function render() {
             var _props = this.props,
@@ -25344,7 +25325,7 @@ var BreadcrumbsItem = (_temp = _class = function (_Component) {
     }]);
 
     return BreadcrumbsItem;
-}(_react.Component), _class.propTypes = {
+}(_react.PureComponent), _class.propTypes = {
     active: _propTypes2.default.bool
 }, _class.defaultProps = {
     active: false
@@ -25615,4 +25596,4 @@ if(false) {
 /***/ })
 
 /******/ });
-//# sourceMappingURL=bundle.js.map?a1671953f0b6aabaa35e
+//# sourceMappingURL=bundle.js.map?ded80544df27ac40abbb
diff --git a/docs/bundle.js.map b/docs/bundle.js.map
diff --git a/docs/index.html b/docs/index.html
@@ -41,5 +41,5 @@
         </div>
     </nav>
     <div id="container"></div>
-<script type="text/javascript" src="bundle.js?a1671953f0b6aabaa35e"></script></body>
+<script type="text/javascript" src="bundle.js?ded80544df27ac40abbb"></script></body>
 </html>
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@trendmicro/react-breadcrumbs",
-  "version": "0.5.2",
+  "version": "0.5.3",
   "description": "Trend Micro Components: React Breadcrumbs",
   "main": "lib/index.js",
   "files": [
@@ -49,8 +49,7 @@
   },
   "dependencies": {
     "classnames": "^2.2.5",
-    "prop-types": "^15.5.8",
-    "react-addons-shallow-compare": "^0.14.0 || ^15.0.0"
+    "prop-types": "^15.5.8"
   },
   "devDependencies": {
     "@trendmicro/react-anchor": "~0.5.4",

diff --git a/src/Breadcrumbs.jsx b/src/Breadcrumbs.jsx
@@ -1,20 +1,16 @@
 import classNames from 'classnames';
 import PropTypes from 'prop-types';
-import React, { Component, cloneElement } from 'react';
-import shallowCompare from 'react-addons-shallow-compare';
+import React, { PureComponent, cloneElement } from 'react';
 import styles from './index.styl';
 
-class Breadcrumbs extends Component {
+class Breadcrumbs extends PureComponent {
     static propTypes = {
         showLineSeparator: PropTypes.bool
     };
     static defaultProps = {
         showLineSeparator: false
     };
 
-    shouldComponentUpdate(nextProps, nextState) {
-        return shallowCompare(this, nextProps, nextState);
-    }
     render() {
         const {
             children,

diff --git a/src/BreadcrumbsItem.jsx b/src/BreadcrumbsItem.jsx
@@ -1,20 +1,16 @@
 import classNames from 'classnames';
 import PropTypes from 'prop-types';
-import React, { Component } from 'react';
-import shallowCompare from 'react-addons-shallow-compare';
+import React, { PureComponent } from 'react';
 import styles from './index.styl';
 
-class BreadcrumbsItem extends Component {
+class BreadcrumbsItem extends PureComponent {
     static propTypes = {
         active: PropTypes.bool
     };
     static defaultProps = {
         active: false
     };
 
-    shouldComponentUpdate(nextProps, nextState) {
-        return shallowCompare(this, nextProps, nextState);
-    }
     render() {
         const {
             className,