Web Performance

You should care about web performance. Web performance is important for user experience and SEO. Improving web performance increases the conversion rate. And we all want more profit, right?

I share a lot of tips on how to improve web performance. This article will be some kind of archive for them.

This article will be updated frequently, so be sure to bookmark it!

Let's start

Lazy loading of the images

You can use the loading=lazy attribute to defer the loading of the image until the user scrolls to them.

<img src='image.jpg' loading='lazy' alt='Alternative Text'>

Fonts requests optimizing

You can specify a text= value in your font request URL to reduce the size of the font file by up to 90%.

<!-- Instead of loading the whole font -->
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Comfortaa">

Load only what you will use.
Super useful when you're using a web font in a logo or heading
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Comfortaa&text=Hello">

If you liked this article, be sure to ❤️ it.

Happy coding! ❤️

Comments (2)

Bala's photo

Lazy Loading works in all browsers? I have used in our site,but it doesn't work in our site: bizappln.com

Marko Denic's photo

It doesn't work in IE, Bala. But, it's fine because, in that case, this attribute will be ignored. Actually, you don't use it on your website. Or, at least not on the homepage. Have fun.