search

AllenFang / react-bootstrap-table

A Bootstrap table built with React.js
https://allenfang.github.io/react-bootstrap-table/
MIT License
2.23k stars 782 forks source link

Performance issues? #695

Open Obiwarn opened 8 years ago

Obiwarn commented 8 years ago

This is a minor issue but when I do a reactive search in my table, Griddle felt a lot snappier than this table (I guess it could have to do with column resizing?). Maybe there is room for performance improvements (e.g. fixed widths or sth.)?

Obiwarn commented 8 years ago

Um. Just wanted to let you know this issue gets quite massive when you have a decent table. e.g. mine has like 10 columns with 3 dates and when I want to show more than 10 rows it gets quite laggy.

AllenFang commented 8 years ago

@obiwarn, yap, there's actually a known performance issue. I'll try to fix it. But really need some time.. Sorry, I'm also busy on my work. So PR is welcome.

zekedroid commented 8 years ago

By fixing it, are you talking about implementing virtual rendering? Because that would be awesome in many levels. It's the last thing this needs to totally overshadow other static table libraries.

Obiwarn commented 8 years ago

@AllenFang indeed. I reviewed all popular table libs and yours is just fantastic and has such great code samples.

AllenFang commented 8 years ago

@obiwarn, thanks, I'll do my best. BTW, #566 tried to fix the rendering performance issue and I still consider if add this PR to v3.0.0. Anyway, there're a lots of jobs to do in v3.0.0, so PR is welcome :)

oakley808 commented 7 years ago

I'd have to agree with others here. This is by far the best table component I've used. 👏 I ditched fixed-data-table and griddle for react-bootstrap-table. But the performance on 750 rows X 25 columns is about 10s to render. [ouch] But I can use pagination to mitigate it for now. :-)

oeph commented 7 years ago

@AllenFang i implemented lazy loading (#26, #557) for this table, which should fix the performance issue. I can provide a PR, but this will take some time since i have a lot to do at work.

AllenFang commented 7 years ago

@oeph, that's ok, PR is welcome :)

kzbikowski commented 7 years ago

@oeph any progress in terms of lazy loading? I'm thinking of implementing it but don't want to duplicate the work

oeph commented 7 years ago

@kzbikowski i have it done. i will merge on current branch and make a PR. not sure tho on the exact time

SimonDKnight commented 7 years ago

Hi @oeph , did your implementation of infinite scroll get merged in? I am super keen to get infinite scroll working on the table. Thanks. Simon

oeph commented 7 years ago

since the lazy loading was implemented last year nov. there are major changes within the component itself. I'm working on the solution in the current version without breaking the current API, but for now i would suggest to use the method described in #1133 or use react-virtualized for example.

since i'm busy at work i can't make any promises when i will have this finished

nakulthebuilder commented 6 years ago

Hi just wanted to ask if lazy loading/virtualization is still being actively worked on? If not, in the above comment it @oeph mentions using this library with react-virtualized. Wondering if anyone could provide a simple example of how that would work. Thanks for this great library!

JohnVLinton commented 6 years ago

I'm having a lot of issues too with table load time. I have basically two tables on screen, one hidden, then when a user hits a tab, that table is then displayed. I'd be happy to do something more like div display:block vs. none to quickly show/hide it but doesn't seem obvious how I do this in React, so each tab toggle requires a real-time redraw...

oeph commented 6 years ago

@JohnVLinton To me that sounds more like a problem with the tab component. It could just render the selected tab instead of rendering both and using display:none;

Since react-bootstrap-table is not actively worked on anymore, you should maybe look at https://github.com/react-bootstrap-table/react-bootstrap-table2