I have a page in my multi page app where intend to use nested list views but my app performance degrades heavily.
There are no queries being run, it just seems to be happening based on how I’ve structured the page.
I don’t feel like there’s too many components, but that could be the issue.
The main list view is a list of “borrowers” (usually 2 to 3 borrowers within the list) and each borrower can have multiple addresses (current and old) which is list view number 2.
The goal is the edit/add/remove the addresses and borrower information via text input components, selects, etc.
I have about 100 components at the moment, with most of them being containers/stacks to format the page well.
Is there something else going on or are nested list views a bad idea?
I can pretty much no longer edit the page. Dragging or moving components takes 10-15 seconds, but I’m starting to see the browser crash now as well.
I am on Retool cloud.
Apologies for the performance. It definitely shouldn't be slowing down that much
I sometimes see some performance drawbacks with doubly nested list views, have you tried using the tabbed container component as an alternative?
Hopefully there are some easy changes we can make to help improve performance, usually its queries that are the culprit but I would love to take a look at your app to better help and further diagnose!
If you can DM me the JSON export of your app, I can clone it and test it out. You can get this JSOn by click on the export button in the debugger panel in the bottom right.
The button with the down arrow to the left of the X is going to be the button to generate the JSON.
Just wanted to circle back and see if you are still having your app crash. I was curious if you are self hosted or on the cloud as well, for the purpose of checking your container logs to see if we could find more details about what is going on.
Hi Jack. I have the same issue. I can't delete nested list components in the editor, it freezes instantly. I've tried a few different ways to do it, all with same result.
Apologies for this issue. Just to clarify, you have list view components nested inside of a parent list view component?
Could you share an export JSON of you app so I can test the app out to see if it is freezing for me, as well as if I can find another way to delete the nested child components?
I mentioned how to export an app in my comment above!
Jumping in to validate this complaint. Trying to delete one empty container (out of 3) from a small (4 item) listView just crashed the editor repeatedly in Chrome. Chrome kept asking whether I wanted to wait or exit (if you choose exit, the page crashes with the error: RESULT: CODE HUNG). Choosing wait spins the tab's memory usage up from 1.7gb (baseline) to 3.4gb, and the deletion took about three minutes in total to work its way through the editor. Meanwhile, the Performance Manager in the Debug console says everything should be fine.
Note that "code hung" errors are a longtime issue for us in Retool, and we've found that they tend to happen when deleting or cutting/pasting components.
Here is a video of me deleting components out of a container and several containers inside of a listView with a much larger number of items in it.
I am not sure if this is an issue for older versions that are self hosted or if there is some type of app bloat in terms of the data that the browser is trying to handle that could be contributing to the behavior you are reporting
