Embedded app taking too long to load

Queries and Resources
1

  • Goal: We embedded two retool apps into our current frontend infrastructure however we have seen that the first load could take more than 5 seconds which could result in a bad user experience. Is this an expected behavior? Given the case that we have more than 10 queries in both apps.

  • Steps: In the meantime I've been trying to improve the performance by disabling some queries that are not being in use, and caching the ones with static information. But still the results are not the ideal

  • Details:
    image
    I have seen that some of the slowest queries in retool performance tab, takes more than a second in retool, however in postman they take less than a second.

image

For example this query takes less than a half of the time that it takes in retool

image
image1376×462 36.6 KB

image

Thank you in advance :slight_smile:

2

Hey @amilcarSanchez,

The first load could take more than 5 seconds which could result in a bad user experience. Is this an expected behavior?

First load time is dependent on many factors:

  • The size of your retool app, how many components are rendered on load
  • The number of queries, how long they take, how expensive it is to process a response
  • Your CPU, and network connection

From your screenshot, I'm guessing your app is relatively complex, so 5s is not unreasonable given a query time of 2.5s.

I have seen that some of the slowest queries in retool performance tab, takes more than a second in retool, however in postman they take less than a second.

This is a common issue I've seen people bring up. The discrepancy you're seeing is that Retool includes any time the browser spends waiting to process a response in that query number. Postman does not include that time. You can see a further breakdown of query time in edit mode, if you mouse over the query time:

Screenshot 2024-02-22 at 2.06.51 PM
Screenshot 2024-02-22 at 2.06.51 PM720×564 45.1 KB

Hope this helps!

1 Like
3

One more thing, I saw someone share this good blog post with a bunch of performance tips, worth a read:

2 Likes
4

Thank you for the response!

5

Hey @amilcarSanchez & @PeteTheHeat,

we are having a quite similiar issue. We are embedding retool into our React frontend to prototype certain functionality faster. The apps themselves are quite lightweight (mainly a table + 2 queries).
However the loading times are becoming an issue. More specifically it takes 10sec from retrieving the presigned URL from our backend to retool having loaded and starting the queries to get data in the frontend.

@amilcarSanchez, did you get anywhere optimizing your app?
@PeteTheHeat, do you have any recommendations on improving the first loading times, e.g. prefetching retool components?

Cheers,
Philipp

6

Hey @philipp1,

10 seconds is quite a long time, but it's tough to give recommendations without more information. If you could send a chrome performance trace to performance @retool.com, I may have some suggestions.

Cheers,
Peter