React Performance

Salut, am o problema la randarea unei liste mai mari in ReactJs, am eliminat toate SubComponentele si tot ce tine de ClassName , href si onClick, am tranformat key-ile sa fie string-uri si am integrat Perf de la react addons si implementat shouldComponentUpdate .

Perf imi spune ca face exports pentru fiecare row din tabela undeva la 25 ms.

La implementara de shouldComponentUpdate nu am vazut nici o diferenta.

As vrea sa stiu daca cumva a avut cineva problema asta si cum a rezolvat-o.

Merci,
Raluca

2 Likes

Cred ca @navaru se pricepe la React cel mai bine de pe aici.

Poti pune un snippet de cod? Conteaza cati itemi vrei sa afisezi o data si cat de mare este lista.

Sunt cateva module care te pot ajuta pt. o listare mai performanta: react-virtualized, react-list, etc.

2 Likes

salut putem face un teamviewer daca vrei maine sunt disponibila oricand si si in seara asta daca poti mai incolo

Dacă ai multe elemtene în listă (ordinul miilor sau a zecilor de mii) problema de performață o să fie la nivel de DOM, nu la nivel de React.

Va trebui să găsești o modalitate de a nu le randa pe toate. Fie paginezi, fie folosești ceva gen virtual-scrolling.

1 Like

cred ca era vorba de max ~200 items

Salut, am integrat react virtualized si e mai nasol decat fara, se blocheaza browserul mult mai mult decat inainte. Daca cumva aveti alta idee.

Merci

Mai exact ce ai integrat din react virtualized ?
https://github.com/bvaughn/react-virtualized/blob/master/source/VirtualScroll/VirtualScroll.example.js ?