├── .gitignore
├── README.md
├── package.json
├── ReactRAFBatching.js
├── requestAnimationFrame.js
└── ReactRAFBatchingStrategy.js


/.gitignore:
--------------------------------------------------------------------------------
1 | *~
2 | node_modules


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # react-raf-batching
2 | 
3 | **NOTE**: this repo was intended as an example and is kept here for historical purposes. Please don't use it in a real project!
4 | 
5 | A batching strategy for React that's more like a game. This may make your apps more performant but harder to test.
6 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "react-raf-batching",
 3 |   "version": "0.9.0",
 4 |   "description": "High performance batching strategy for React",
 5 |   "main": "ReactRAFBatching.js",
 6 |   "scripts": {
 7 |     "test": "echo \"Error: no test specified\" && exit 1"
 8 |   },
 9 |   "peerDependencies": {
10 |     "react": "~0.9"
11 |   },
12 |   "repository": {
13 |     "type": "git",
14 |     "url": "https://github.com/petehunt/react-raf-batching"
15 |   },
16 |   "keywords": [
17 |     "react",
18 |     "requestanimationframe"
19 |   ],
20 |   "author": "Pete Hunt",
21 |   "license": "Apache 2"
22 | }
23 | 


--------------------------------------------------------------------------------
/ReactRAFBatching.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * Copyright 2013 Facebook, Inc.
 3 |  *
 4 |  * Licensed under the Apache License, Version 2.0 (the "License");
 5 |  * you may not use this file except in compliance with the License.
 6 |  * You may obtain a copy of the License at
 7 |  *
 8 |  * http://www.apache.org/licenses/LICENSE-2.0
 9 |  *
10 |  * Unless required by applicable law or agreed to in writing, software
11 |  * distributed under the License is distributed on an "AS IS" BASIS,
12 |  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13 |  * See the License for the specific language governing permissions and
14 |  * limitations under the License.
15 |  */
16 | 
17 | var ReactRAFBatchingStrategy = require('./ReactRAFBatchingStrategy');
18 | var ReactUpdates = require('react/lib/ReactUpdates');
19 | 
20 | function inject() {
21 |   ReactUpdates.injection.injectBatchingStrategy(ReactRAFBatchingStrategy);
22 | }
23 | 
24 | var ReactRAFBatching = {
25 |   inject: inject
26 | };
27 | 
28 | module.exports = ReactRAFBatching;
29 | 
30 | 


--------------------------------------------------------------------------------
/requestAnimationFrame.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * Copyright 2013 Facebook, Inc.
 3 |  *
 4 |  * Licensed under the Apache License, Version 2.0 (the "License");
 5 |  * you may not use this file except in compliance with the License.
 6 |  * You may obtain a copy of the License at
 7 |  *
 8 |  * http://www.apache.org/licenses/LICENSE-2.0
 9 |  *
10 |  * Unless required by applicable law or agreed to in writing, software
11 |  * distributed under the License is distributed on an "AS IS" BASIS,
12 |  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13 |  * See the License for the specific language governing permissions and
14 |  * limitations under the License.
15 |  */
16 | 
17 | // Note that this is not a complete polyfill as it doesn't
18 | // pass the ticks parameter to the callback.
19 | 
20 | function setTimeoutRequestAnimationFrame(cb) {
21 |   setTimeout(cb, 1000 / 60);
22 | };
23 | 
24 | var requestAnimationFrame;
25 | 
26 | if (typeof window === 'undefined') {
27 |   requestAnimationFrame = setTimeoutRequestAnimationFrame;
28 | } else {
29 |   requestAnimationFrame = window.requestAnimationFrame ||
30 |     window.webkitRequestAnimationFrame ||
31 |     window.mozRequestAnimationFrame ||
32 |     window.msRequestAnimationFrame ||
33 |     setTimeoutRequestAnimationFrame;
34 | }
35 | 
36 | module.exports = requestAnimationFrame;


--------------------------------------------------------------------------------
/ReactRAFBatchingStrategy.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * Copyright 2013 Facebook, Inc.
 3 |  *
 4 |  * Licensed under the Apache License, Version 2.0 (the "License");
 5 |  * you may not use this file except in compliance with the License.
 6 |  * You may obtain a copy of the License at
 7 |  *
 8 |  * http://www.apache.org/licenses/LICENSE-2.0
 9 |  *
10 |  * Unless required by applicable law or agreed to in writing, software
11 |  * distributed under the License is distributed on an "AS IS" BASIS,
12 |  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13 |  * See the License for the specific language governing permissions and
14 |  * limitations under the License.
15 |  *
16 |  * @providesModule ReactRAFBatchingStrategy
17 |  */
18 | 
19 | "use strict";
20 | 
21 | var ReactUpdates = require('react/lib/ReactUpdates');
22 | 
23 | var requestAnimationFrame = require('./requestAnimationFrame');
24 | 
25 | function tick() {
26 |   ReactUpdates.flushBatchedUpdates();
27 |   requestAnimationFrame(tick);
28 | }
29 | 
30 | var ReactRAFBatchingStrategy = {
31 |   isBatchingUpdates: true,
32 | 
33 |   /**
34 |    * Call the provided function in a context within which calls to `setState`
35 |    * and friends are batched such that components aren't updated unnecessarily.
36 |    */
37 |   batchedUpdates: function(callback, param) {
38 |     callback(param);
39 |   }
40 | };
41 | 
42 | requestAnimationFrame(tick);
43 | 
44 | module.exports = ReactRAFBatchingStrategy;


--------------------------------------------------------------------------------