Big performance issues on first load

Hi,

I am seeing a huge load times when loading the application for the first time. Some JS and CSS files are taking upto 30secs to load and then there is additional rendering time.
I can see around 340 requests are made, not sure if its anything to with my setup or app.

This is resulting in blank white page till the rendering happens after about 40 secs.

Need help to understand what I am missing.

My setup:
Using the react-retool component to render publicly accessible page built on retool.

Let me know how to share har files for your review, not able to attach it here.

Hey Harsha,

Thanks for your post, and sorry to hear you're running into performance issues.

You can email me the .har file at petera@retool.com and I'll take a look. If you're willing to share, an export of your app would also be very useful for me to help debug ( ... > Export to JSON). You can attach those files to the email, or send a link to dropbox/google drive.

In the meantime, not sure if you've already seen this page about performance best practices.

-Peter

Thanks @PeteTheHeat.
I have sent mail with requested files.

I am sure there are many optimizations I can do within the app. However, I am more concerned about initial server response and render time.

To close the loop on the post, the issue ended up being a network problem.

This was deduced by looking at the network tab in Chrome dev tools. Retool loads 60-100 small chunks of JS and CSS on app load. These chunks are usually served from cache, and take <20ms to load. In this example, when not served from cache, some chunks were taking 30-60s to load. Most of this time was spent in the "queueing" or "stalled" state, which is indicative of a network stack issue.

Feel free to reach out to performance@retool.com with any performance related issues.

1 Like