リアクションライフサイクルで長時間実行されるDOMアップデートプロセス

Question

私は、Mapbox GLで構築された2つのマップを含む1つのReactコンポーネントを持っています。 これらは左右のマップ​​です。

コンポーネントは、サーバーからデータを取得してReduxストアを通過するときに、leftMapDataとrightMapDataのような小道具を個別に受け取ります。

内側私は新しい小道具が以前とは違っているかどうかを確認し、数秒かかるマップボックスGLマップ更新ルーチンを実行します。

2つ以上のイベントが急速に発生した場合、最初からすぐに更新がキャンセルされ、マップが正しく更新されません。

次回のアップデートで更新手順がキャンセルされないようにするにはどうすればよいですか？

小道具が1つの地図のみに表示されることがあります。その場合、小道具のみを更新する必要があります。時には小道具が両方の地図に来るので、別の地図を壊すことなく、それぞれの地図を独立して更新する必要があります。

Answer 1

shouldComponentUpdateメソッドを使用して、コンポーネントの更新を制御できます。

shouldComponentUpdate: function(nextProps, nextState) { // This function should return a boolean, whether the component should re-render. //Recommended - Do not do deep equality checks or using JSON.stringify() //to avoid performance issues return false; }