Hi everyone,
Our users are experiencing similar performance issues the last few weeks. Thank you all for sharing details here and for the updates @joeBumbaca.
I know there may be several different issues overlapping here so I'll try to provide as much detail as possible in case something is useful for the Retool team or anyone else debugging their apps.
My general issue
Users are reporting 2-3 seconds to load apps in Safari vs 10-15 seconds in Chrome. These are anecdotal from non-technical users so I don't have exact data from dev tools for Performance Log: Time to first query: x, time to first contentful paint, or similar. I got a video showing the difference between Chrome and Safari side by side which matched these estimates visually.
Details from our users:
- Devices and OS: A mix of windows and mac.
- Browser: only seeing this on Chrome
- Internet: 2GB fiber
- Location: Central US (Oklahoma)
Like @dguzzo and @thenatechambers, our issue seems to be isolated to Chrome.
Some details on our multi-page application:
- App 1
- ~30 components, basically just a table and some supporting filter/search components
- The table has <150 rows of data in production
- 100% performance score (2 query runs, <30 components and code blocks)
- App 2
- Identical to app 3 but loads different data in the table (<50 rows of data in production)
- App 3
- A much more complex app with 32% performance score
- 4 queries on load (many more on actions in app)
- >500 components and code blocks
- 26840 dependency graph nodes
- A header module shared across all three apps
- Logo + navigation buttons
- Retool Cloud V3.50.0-a6ac5e6 (Build 1702460
Navigating between Apps 1 and 2 is understandably faster than between 1 > 3 or 2 > 3. But I'm still seeing consistently ~3-4 seconds to load (Performance Log: Time to first query) Apps 1 and 2 whether I navigate in-app or go directly to an app's URL.
My personal experience has been much faster than our users despite worse internet connection and a slower machine.
My specs:
- Chrome Version 124.0.6367.91 (Official Build) (arm64)
- macOS 14.4.1 (23E224) (Macbook AIr M1 from 2020)
- Location: Vietnam
- Internet: varies, but usually 50-100mbps down
Nothing seems to have improved in our case. Users are reporting this for a few weeks and the newest report + video is from yesterday, Wednesday May 1. I don't have good before and after metrics to share beyond the anecdotal and what I tested today.
I thought this might be happening in our case as well but after checking I don't think it is. The main navigation in our app (besides links in a header module) is clicking a table row. Click row, navigate to view that row's data in more depth in App 3 (the most complex). I double checked and this table action does load the target app with the uiid in the URL in format https://<subdomain>.retool.com/apps/<uuid>/<app_name>?<query_params>
I've been watching the performance score drop as we add more functionality and considered splitting it up. But we've also been experiencing this issue of app blinking and modules reloading causing poor multi-app experience so I am hesitant to split the bigger App 3 out into multiple apps for performance until I can ensure the multi-app experience is smoother. The load delay + blink really feels like navigating between two different web pages instead of two parts of the same "app". And though the performance score is low, I haven't personally had issues with this bigger app loading as slow as reported.
Edit, my tests below are no longer relevant:
I thought this showed that a simple Retool app was loading much slower on Chrome. But I realized having Chrome devtools open was slowing my requests. I'd checked that the cache was enabled and there was no network throttling so I thought there was no difference. Disabling async stack trace as suggested in this Stack Overflow thread now shows my Chrome load times are similar to Safari and Firefox. I am so far unable to replicate the slow load times reported by my users.
Some new tests
While testing this issue today I noticed the slowness of loading/navigating between our two smaller apps 1 & 2 (with 100% performance score). It's not 10-15 seconds like users are reporting, but it's slower than I'd expect given the simplicity, performance score, and my internet/machine. Seeing Performance Log: Time to first query: of ~3000ms consistently.
So I devised a little test. I created 3 brand new apps:
Apps contain <5 components each (couple buttons and text header)One app includes a table with some dummy data and event handler for row clicks to navigate to another app (similar to our real app)No queries in any appAll have 100% performance score:
Here are the apps:
These apps are dead simple, just navigating between each other with the buttons and the table row action. I then compared navigating between the apps across Chrome, Safari, and Firefox using Performance Log: Time to first query in the console for simplicity. I disabled all extensions on all three browsers and only had 2 tabs open on each.
Video: Here is a loom video showing the same app on each browser.
The result: I consistently got ~2500-3500ms on Chrome and ~600-800ms on Firefox and Safari.
Comments on the issue I linked above related to app blinking mention modules as a potential cause so I did two other tests:
Copied all three of my brand new test apps and added a header module to all three with navigation to all threeCopied our actual three apps and removed the header module from all three
In both cases the performance is similar with and without the header.
Hope this helps in the debugging process and performance issues we can't impact with in-app tweaks will be resolved soon. I'm working to get more concrete details from our app users and do some additional testing with their machines and if I learn anything useful I'll update here.
