Good evening,I'm trying to optimize loading times of a prototype e-commerce app, starting with the homepage.https://personal-5amqbjp7.outsystemscloud.com/TDD_FO/HomeWhile accessing it, it's rather slow. I don't load many products and the images for these same products are optimized.How can I further improve the loading time?It's the first time I'm ever focusing on efficiency and loading times with Outsystems.Thank you for reading this far!
Hi Pedro,
You just have to drag and drop the HAR file to Network section refer below snapshot for the same.
Post this step it will show you the list of actions/scripts along with their response time.
From HAR file it seems you have couple of data actions which is taking time to give response.
It seems you are calling "DataActoinProductsFilter" twice and in both call it is taking 6-10sec to complete. Try to optimize this data action if you are fetching huge data using Aggregate try to use SQL for the same or if you have complex logic then try to break them into chunks and use server actions instead.
Hope this will help you.
Happy codding :)
Regards,
-V.S.
Hi Pedro , I would suggest the following steps to optimize your e-commerce app's loading time:
Server-Side Review:
Client-Side Optimization:
Network Efficiency:
Utilize OutSystems Architecture:
Read More at : https://www.outsystems.com/blog/posts/low-code-architecture/
These steps are aligned with OutSystems' principles of efficient, scalable architecture and should provide significant improvements in your app's performance.RegardsYogesh Huja
Okay, is there a way to diagnose where the speed bottleneck is coming from?
Hi @Pedro de Sousa,
check this forge component
and this
Discovery - Overview | OutSystems
Hope this will help you
You can download the HAR file from Network tab in your browser. It will provide you the details related to which actions are taking time and accordingly you can manipulate your logic and enhance the response time of your screen.
Note :- To open the HAR file you can use your browser extension
How to make use of this HAR file? I researched more about it and found this tool, har analyzer:https://toolbox.googleapps.com/apps/har_analyzer/Is this tool the best suited for this optimization case?I also found this pagespeed:https://pagespeed.web.dev/analysis/https-personal-5amqbjp7-outsystemscloud-com-TDD_FO/9e27af18pq?form_factor=desktopIs it really possible one image is holding up the landing page for 2.5s? That seems surreal
Hello Vipasha,Thanks to your observation that I was calling ProductsFilter twice, I was able to optimize by calling it only once.https://personal-5amqbjp7.outsystemscloud.com/TDD_FO/The loading time is way faster. I see the loading times are smaller now!(Attached a .gif)I noticed aswell that ScreenDataSetGetCategories is called more than once as well and eventhough the impact is not as significant as the previous ProductsFilter was, it's perhaps something to otimize in the future for the sake of best practices. This was a good learning experience. Thank you so much!Do you have any other suggestions for optimization that I may have overlooked?Maybe eventhough I see a huge improvement the loading time can be better than this perhaps? Wishing a happy new year,Pedro de Sousa
Seems like your initial server calls are taking 6 seconds for only Product max, min and filter and they are called synchronously. You can try to optimize them. I think for very first time you can keep the default value of min and max in filter. You can also optimize the server side time of product filter as its taking more then 2 seconds. Secondly you can try to show the Images and templates with loader and the data can be populated later.
Hope this would help.
Regards
Devendra