react-addons-pure-render-mixin - npm Package Compare versions

Comparing version 15.5.1 to 15.5.2

package.json

 {
   "name": "react-addons-pure-render-mixin",
-  "version": "15.5.1",
+  "version": "15.5.2",
   "main": "index.js",
@@ -5,0 +5,0 @@ "repository": "facebook/react",

react-addons-pure-render-mixin.js

@@ -66,3 +66,3 @@ (function(f) {
  * @typechecks
- *
+ * 
  */
@@ -126,2 +126,2 @@
 },{}]},{},[1])(1)
-});
+});

react-addons-pure-render-mixin.min.js

@@ -1,1 +0,1 @@
-(function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}if(typeof g.React==="undefined"){throw Error("React module should be required before PureRenderMixin")}else if(typeof g.React.addons==="undefined"){g.React.addons={}}g.React.addons.PureRenderMixin=f()}})(function(){var define,module,exports;return function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s}({1:[function(require,module,exports){"use strict";var shallowEqual=require("fbjs/lib/shallowEqual");module.exports={shouldComponentUpdate:function(nextProps,nextState){return!shallowEqual(this.props,nextProps)||!shallowEqual(this.state,nextState)}}},{"fbjs/lib/shallowEqual":2}],2:[function(require,module,exports){"use strict";var hasOwnProperty=Object.prototype.hasOwnProperty;function is(x,y){if(x===y){return x!==0||y!==0||1/x===1/y}else{return x!==x&&y!==y}}function shallowEqual(objA,objB){if(is(objA,objB)){return true}if(typeof objA!=="object"||objA===null||typeof objB!=="object"||objB===null){return false}var keysA=Object.keys(objA);var keysB=Object.keys(objB);if(keysA.length!==keysB.length){return false}for(var i=0;i<keysA.length;i++){if(!hasOwnProperty.call(objB,keysA[i])||!is(objA[keysA[i]],objB[keysA[i]])){return false}}return true}module.exports=shallowEqual},{}]},{},[1])(1)});
+!function(f){if("object"==typeof exports&&"undefined"!=typeof module)module.exports=f();else if("function"==typeof define&&define.amd)define([],f);else{var g;if(g="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:this,void 0===g.React)throw Error("React module should be required before PureRenderMixin");void 0===g.React.addons&&(g.React.addons={}),g.React.addons.PureRenderMixin=f()}}(function(){return function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a="function"==typeof require&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n||e)},l,l.exports,e,t,n,r)}return n[o].exports}for(var i="function"==typeof require&&require,o=0;o<r.length;o++)s(r[o]);return s}({1:[function(require,module,exports){"use strict";var shallowEqual=require(2);module.exports={shouldComponentUpdate:function(nextProps,nextState){return!shallowEqual(this.props,nextProps)||!shallowEqual(this.state,nextState)}}},{2:2}],2:[function(require,module,exports){"use strict";function is(x,y){return x===y?0!==x||0!==y||1/x==1/y:x!==x&&y!==y}function shallowEqual(objA,objB){if(is(objA,objB))return!0;if("object"!=typeof objA||null===objA||"object"!=typeof objB||null===objB)return!1;var keysA=Object.keys(objA),keysB=Object.keys(objB);if(keysA.length!==keysB.length)return!1;for(var i=0;i<keysA.length;i++)if(!hasOwnProperty.call(objB,keysA[i])||!is(objA[keysA[i]],objB[keysA[i]]))return!1;return!0}var hasOwnProperty=Object.prototype.hasOwnProperty;module.exports=shallowEqual},{}]},{},[1])(1)});

README.md

 # react-addons-pure-render-mixin
 
-This package provides the React PureRenderMixin add-on.
+>**Note:**
+>This is a legacy React addon, and is no longer maintained.
+>
+>We don't encourage using it in new code, but it exists for backwards compatibility.  
+>The recommended migration path is to use [`React.PureComponent`](https://facebook.github.io/react/docs/react-api.html#react.purecomponent) instead.
 
-See <https://facebook.github.io/react/docs/pure-render-mixin.html> for more information.
+**Importing**
+
+```javascript
+import PureRenderMixin from 'react-addons-pure-render-mixin'; // ES6
+var PureRenderMixin = require('react-addons-pure-render-mixin'); // ES5 with npm
+```
+
+If you prefer a `<script>` tag, you can get it from `React.addons.PureRenderMixin` with:
+
+```html
+<!-- development version -->
+<script src="https://unpkg.com/react-addons-pure-render-mixin/react-addons-pure-render-mixin.js"></script>
+
+<!-- production version -->
+<script src="https://unpkg.com/react-addons-pure-render-mixin/react-addons-pure-render-mixin.min.js"></script>
+```
+
+In this case, make sure to put the `<script>` tag after React.
+
+## Overview
+
+If your React component's render function renders the same result given the same props and state, you can use this mixin for a performance boost in some cases.
+
+Example:
+
+```js
+const createReactClass = require('create-react-class');
+
+createReactClass({
+  mixins: [PureRenderMixin],
+
+  render: function() {
+    return <div className={this.props.className}>foo</div>;
+  }
+});
+```
+
+Under the hood, the mixin implements [shouldComponentUpdate](https://facebook.github.io/react/docs/component-specs.html#updating-shouldcomponentupdate), in which it compares the current props and state with the next ones and returns `false` if the equalities pass.
+
+> Note:
+>
+> This only shallowly compares the objects. If these contain complex data structures, it may produce false-negatives for deeper differences. Only mix into components which have simple props and state, or use `forceUpdate()` when you know deep data structures have changed. Or, consider using [immutable objects](https://facebook.github.io/immutable-js/) to facilitate fast comparisons of nested data.
+>
+> Furthermore, `shouldComponentUpdate` skips updates for the whole component subtree. Make sure all the children components are also "pure".

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

12219

increased by17.35%

Number of lines in readme file

53

increased by783.33%

Worsened metrics

Lines of code

134

decreased by-1.47%

No dependency changes