Implementing performant web applications is an art on its own. Even if you have no performance issues right now you may like to understand it better and avoid implementing patterns that do not scale.
Very important here is the time it takes to give the user the information or to make the application operational.
There are some tools I found useful.
This is an entry for your favorite links that you can just to pimp up your a web page with hints about the elements in the header element by including a CSS file:
javascript:(function(){ var ct=document.createElement('link'); ct.rel='stylesheet';
ct.href='https://csswizardry.com/ct/ct.css'; ct.classList.add('ct'); document.head.appendChild(ct);}());It rates the elements in the head on the impact regarding performance and adds hints and instructions.
If you study CSS, this one is a good victim for analysis. Be curious and look into the implementation ! - no javascript.
The Developer Tools (F12) or (Shift-ctrl-I) available in Chrome and Edge browsers have evolved a lot in the last years.
They also include a tool to show and analyze the performance. Together with the network tool it gives a lot of insights why page load is slow.
There is a lot to read about this tool:
There are tools available on the internet to analyze your web applications and pages. They can fetch content from your web site and analyzes it when making your application available on the internet.
I found them of great value as they give great value for free.
https://www.webpagetest.org/ - Free tool but also good help inside the analytical results.
https://pagespeed.web.dev/ - Free tool, also analyzing on the level of the downloaded content.
https://www.seobility.net/en/seocheck/ - Checks topics about search engine optimization.