search

sourcegraph / sourcegraph-public-snapshot

Code AI platform with Code Search & Cody
https://sourcegraph.com
Other
10.1k stars 1.27k forks source link

insights: FE resizing browser window renders very slowly #29024

Open unclejustin opened 2 years ago

unclejustin commented 2 years ago

When resizing the browser window on an insights dashboard with multiple insights. The cards redraw and resize very slowly, and the browser becomes unresponsive.

https://user-images.githubusercontent.com/1855233/146102849-a3486766-0c27-4af9-a185-7295848de825.mov

github-actions[bot] commented 2 years ago

Heads up @joelkw @felixfbecker @vovakulikov @unclejustin - the "team/code-insights" label was applied to this issue.

vovakulikov commented 2 years ago

I think it's time to think about virtualization for the grid layout. Or for the grid layout implementation in general. The react-grid-layout isn't perfect (and it's an understatement I would say). This messes up with DOM element ordering and has a mutation-based API.

I remember that @felixfbecker had a proposition about moving from js runtime grid item position to using native CSS grid layout. Seems like a good idea.

My concern about the complexity of this is that we fetching our data inside of card component with apollo API. If these cards wouldn't be rendered (I mean that would be hidden and rendered again if the user scrolls up) it re-triggers data fetching for these cards again. In theory, we could solve this of course we just need to keep this in mind when we start doing this virtualization story.

vovakulikov commented 2 years ago

With capture group insights this problem will affect performance even more than we're seeing this at the moment. More series, more SVG points, more cards on the "All insights" dashboard.

I think we should prioritize this issue and include this in one of the releases before GA cc @Joelkw

Joelkw commented 2 years ago

Thank you @vovakulikov ! Feel free to put together the details of what you'd want to do and propose it for discussion for our next sync sprint planning. Note that in January we plan to work on making it so if you resize an individual insight or reorder the insights on a dashboard, they persist on reload (probably some save/don't save states we may need) so perhaps it makes sense to keep that in mind/do at the same time?