react.js - Render on requestAnimationFrame

Question

Voglio sperimentare le prestazioni di alcuni componenti React all'interno della mia app. So che il framework Om di ClojureScript (https://github.com/swannodette/om) utilizza alcune tecniche di ottimizzazione come l'uso di immutables con l'implementazione di shouldComponentUpdate() e il rendering nella modifica requestAnimationFrame.

C'è un semplice mixin JavaScript che potrebbe introdurre il rendering basato su requestAnimationFrame?

Answer 1

Questo è possibile se si utilizza qualcosa come Browserify o webpack per creare React da un ambiente CommonJS, o altrimenti produrre una build personalizzata di React. Vale a dire, non è possibile fare questo se si utilizza solo il React preinstallato scaricabile.

Partenza di react-raf-batching project per una soluzione più completa (compresa polyfills RAF), ma ecco un esempio minimo per ottenere questo lavoro Pete Hunt:

var ReactUpdates = require("react/lib/ReactUpdates"); 

var rafBatchingStrategy = { 
    isBatchingUpdates: true, 
    batchedUpdates: function(callback, param) { 
    callback(param); 
    } 
}; 

var tick = function() { 
    ReactUpdates.flushBatchedUpdates(); 
    requestAnimationFrame(tick); 
}; 

requestAnimationFrame(tick); 

ReactUpdates.injection.injectBatchingStrategy(rafBatchingStrategy);