![]() ![]() The good news is that with the release of the new media area, DatoCMS nows offers a drop-in solution to all of these issues so that developers can focus on the more exciting stuff. However, the reality is that it's still pretty hard to nail the problem, as the perfect solution requires implementing a combination of all of the stuff mentioned above, which is quite daunting and labor-intensive. Sure, in the last couple of years, we've seen an increased availability of tools that help alleviate the suffering of developers in this regard. You need to handle SEO properly so that search engines will still be able to scrape your page even with all of this stuff in place. You need to lazy load images, that is, defer the loading of images that aren’t immediately visible to when a visitor scrolls down to them, avoiding useless HTTP requests and downloading of data before time Įspecially with lazy loading in place, your HTML needs to embed some kind of placeholder for the image, both to avoid terrible jerky scrolling/layout juddering, and to give visitors a visual hint that in a few milliseconds images will be arriving ![]() You need to provide low-resolution versions of every image you offer - remember, both JPEG and WebP! - so that screens with low resolution or pixel density don't have to download a huge image for no reason You need to encode all of your images in JPEG and WebP, and offer one version or the other depending on whether the browser supports the latter Here’s a quick recap of what it means to offer best-in-class support of React images for a webpage nowadays (we’ll cover every bullet point in detail later): So the question is: are we, as developers, able to optimize web pages for such a wide range of resolutions, pixel densities, and network connection speeds? Sure, we’ve got all the technology we need! Is it easy? Nope, more like a nightmare, and that’s precisely the reason why average page weight keeps on increasing: it’s too much work to handle it properly, especially if you don't have big budgets. But if you’re on a cellular connection, you would probably prefer a lower quality image to a painfully slow page. If you’re on a fiber connection, downloading 1.7MB of data for a single web page (!!!) might not slow you down much, and it gives you a richer experience. Average growth in page weight in the last 3 years ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. Archives
January 2023
Categories |