4 Simple Tricks to Improve Page Speed
Performance is often considered a feature rather than an add-on. There are good reasons for it too. During development, we thrive on giving our best. Somewhere down the course of a product lifecycle, we tend to slip the performance. Don’t worry; we got you covered. The following minor tweaks can boost your page load speed to a greater extent.
Image Lazy loading
Lazy loading is a strategy to identify resources as non-blocking (non-critical) and load these only when needed. It’s a way to shorten the critical rendering path, which translates into reduced page load times. Just add loading="lazy" in your <img /> tags. That would do the trick.
Caching Images
High-quality images are enormous and consume more time to download. It is always better to have a caching strategy for the pictures. Caching will improve the download by more than 700% on consecutive user visits to the page. There is no obligation to reinvent the wheel. A lot of cloud solutions are readily available.
Preconnect and DNS Prefetch
An application will include a myriad of external resources for marketing, analytical, and error reporting purposes. It is better to inform the browser of these external resources so that the browsers can establish connections in advance. Use the tagpreconnect sparsely because it could be counter-productive if overused. Do rely on the marker dns-prefetch for most of the resources.
Remove Unused Fonts
We developers love google fonts because of their simplicity and versatility. But we tend to overuse it a lot!!. Only add the fonts that the application requires. And also, be aware of the font weights; each extra font-weight you add is an additional resource, and there is a performance cost associated with it.
Conclusion
There you go. These are the proven four simple tricks that we have tested in Nirman Technologies' projects. Do share your valuable feedback and any technique that you use in your project to improve performance. Thanks to Varun A P for sharing his knowledge on page speed.
