React.js - 在requestAnimationFrame上渲染

Question

React.js - 在requestAnimationFrame上渲染

javascriptrenderrequestanimationframereactjs

9

我想在我的应用程序中尝试一些React组件的性能。我知道ClojureScript的Om框架（https://github.com/swannodette/om）使用了一些优化技术，例如使用不可变数据结构实现shouldComponentUpdate()和在requestAnimationFrame更改时进行渲染。

是否有纯JavaScript混合器可以引入基于requestAnimationFrame的渲染？

- Kosmetika

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Michelle Tilley · Accepted Answer

如果您使用类似于Browserify或webpack这样的工具从CommonJS环境中构建React，或者生成自定义构建的React，那么这是可能的。也就是说，如果您只使用可下载的预构建React，则无法执行此操作。

请参阅Pete Hunt的react-raf-batching项目以获取更全面的解决方案（包括rAF填充），但以下是一个最简示例，可以让它正常工作：

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