diff --git a/docs/addons-perf.md b/docs/addons-perf.md index aa5dfd2a..6acba063 100644 --- a/docs/addons-perf.md +++ b/docs/addons-perf.md @@ -14,6 +14,11 @@ next: test-utils.html import Perf from 'react-addons-perf' // ES6 var Perf = require('react-addons-perf') // ES5 with npm var Perf = React.addons.Perf; // ES5 with react-with-addons.js + +// Usually importing Perf in ES6 with a module bundler +// doesn't make Perf available as global and throws a +// ReferenceError so create a global +window.Perf = Perf; ``` @@ -57,6 +62,34 @@ The following methods use the measurements returned by [`Perf.getLastMeasurement * * * +## Example Usage + +We will take simple example of a form which can be used to submit comments and then listing all comments. The example code is [available on GitHub](https://github.com/dhyey35/react-example-for-performance/blob/master/public/scripts/example.js). + +```javascript +import { Component } from 'react' +import Perf from 'react-addons-perf' + +const Comment = (props) => ( +
( Ctrl + Shift + i )
and type Perf.start()
+ then post a comment below and type Perf.stop()
followed by Perf.printWasted()
.
+ See documentation for more details. Complete source code of this demo can be found on github.
+