search

tsuruclient / tsuru

desktop client.
MIT License
126 stars 5 forks source link

ツイートが多くなるほどレンダリング時間がかかる #15

Closed origamium closed 6 years ago

origamium commented 6 years ago

恐らくTimelineに表示するContentの数が増えるに連れてpure()によるshallow equalのコストがものすごいことになってるのが悪い。保管するデータの数を制限するか、表示するデータの数を制限すべきです。

origamium commented 6 years ago

recomposeのpure, onlyUpdateForKeysとStateless Functional ComponentsのコンボのせいでPerformanceを計測してもUnknownとしか表示されず、まあContentの表示だろうという強い確信があります

origamium commented 6 years ago

https://github.com/ankeetmaini/react-infinite-scroll-component とかのinfinite scrollをつけてやれば改善しそうです

origamium commented 6 years ago

ツイートだけでなく、タイムラインも際限なく増やすと動作が重くなると思われる。タイムラインのContent Listだけでなく、Timeline ViewにもInfinite scrollをつけるとよさそうです。

origamium commented 6 years ago

Virtualizeしたら2桁ミリ秒までレンダリングを短縮できました。
それでも保持しているContentの数が100を超えると若干のもたつきが発生しますし、そもそもmaterial-uiコンポーネントのマウントコストがかなりかかっている模様。ただの文字列程度、そのままぶちこんでしまうがよろしいのでは

origamium commented 6 years ago

レンダリング時間に関しては一応の解決を見たので閉じます。