-2

Reactjsを呼び出すsetProps(または)前にデータをフィルター処理すると高速になりますか?setState

var component = React.renderComponent(
  <MainApp />,
  document.getElementById("container")
);

var data = {
  name: "p",
  list: [
    {id:1, name:""},
    {id:2, name:""},
    {id:3, name:""},
    //...
  ]
}
component.setProps(data);
data.name = "w";

ここで、「p」を「w」に更新したいと思います。これを行うと、より効率的/高速になりますか?

component.setProps(data);

またはこれ:

component.setProps({name: "w"});

後者の場合、データ オブジェクト全体を再度入れる必要はありませんが、独自のフィルタリングを行う必要があります。

オブジェクト全体を 1 つだけ変更して再度入れた場合、Reactjs はオブジェクト全体を処理するsetProps/setState必要がありますか?それともオブジェクト全体を処理する必要がありrenderますか?


1時間後に編集:

どちらが速いかについて、満足のいく技術的な答えは得られませんでした。

真相を突き止めるのではなく、簡単な jsPerf テストケースを実行して、どちらが高速かを確認し、技術的な真実ではなく、統計上の真実として単純に受け入れました。

http://jsperf.com/reactjs-setprops-big-or-setprops-small

驚くべきことに、大きなオブジェクトを与えると、無視できるほど速くなります。(もっと遅いと思いました。)入力が小さいか大きいかに関係なく、内部的にReactJSはとにかくオブジェクト全体を処理する必要があると思います。大きなオブジェクト (変更されていない) の処理を​​スキップすることはできないため、大きなオブジェクトを渡さなくても時間の節約にはなりません。

4

1 に答える 1

0

更新する必要のあるキーのみを渡すと、微視的な量で高速になりますが、最も便利なものを渡す必要があります。独自のフィルタリングを行うと、渡すキーを少なくすることで得られる時間の利点が相殺されます。

他の回答で述べたように、これらの小さな変更は、心配するほど大きな違いにはなりません。最も簡単なことを行い、アプリが遅い場合にのみ、shouldComponentUpdateメソッドを追加して不要な更新を減らすことを検討してください。

于 2014-02-24T06:47:34.080 に答える