react.js - Renderowanie na żądanieAnimationFrame

Question

Chcę eksperymentować z wydajnością niektórych komponentów React w mojej aplikacji. Wiem, że framework Om ClojureScript (https://github.com/swannodette/om) wykorzystuje pewne techniki optymalizacji, takie jak używanie narzędzi niezmiennych z implementacją shouldComponentUpdate() i renderowanie na zmianę requestAnimationFrame.

Czy istnieje zwykły mixin JavaScript, który może wprowadzić rendering na podstawie requestAnimationFrame?

Answer 1

Jest to możliwe, jeśli użyjesz czegoś takiego jak Browserify lub do zbudowania React ze środowiska CommonJS lub w inny sposób do stworzenia niestandardowej wersji React. To znaczy, że nie możesz zrobić tego, jeśli po prostu użyjesz gotowego, gotowego React.

Wyjazd Pete Hunt react-raf-batching project bardziej kompleksowego rozwiązania (w tym polyfills RAF), ale tu jest minimalny przykład, aby uzyskać tej pracy:

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);