{"id":73,"date":"2022-05-01T16:36:11","date_gmt":"2022-05-01T16:36:11","guid":{"rendered":"https:\/\/ads.geza.dev\/blog\/?p=73"},"modified":"2023-04-20T12:13:50","modified_gmt":"2023-04-20T12:13:50","slug":"what-is-lazy-loading","status":"publish","type":"post","link":"https:\/\/adsinteractive.com\/blog\/what-is-lazy-loading\/","title":{"rendered":"What is Lazy Loading?"},"content":{"rendered":"\n

In our previous post regarding Google Core Web Vitals<\/a>, we detailed why every publisher who wants to get the most out of their website should provide their readers the best possible user experience. Today we take a look at Lazy Load<\/strong>ing<\/strong> technology and reveal every detail you need to know about it.<\/p>\n\n\n\n

Lazy Loading<\/strong><\/p>\n\n\n\n

Typically, when a user opens a web page, the content of the entire page is downloaded and displayed in one step. Lazy loading sounds weird, but it\u2019s a simple concept: a script or image is only loaded when it is needed. The opposite is eager loading, which means loading everything at once (e.g. loading the entire page for the first time).<\/p>\n\n\n

\n
\"man
Use Lazy Loading<\/figcaption><\/figure>\n<\/div>\n\n\n

Of course, eager loading has the advantage that everything is immediately available when you need it, but there is a downside to retrieving a lot of data ahead of time – you download data you may never need (e.g. appear in a part of the page that the user never visits).

Lazy loading can speed up the initial load time of a page<\/strong> by avoiding premature downloads of unnecessary resources. It can also save users bandwidth.<\/p>\n\n\n\n

An example of Lazy Loading<\/h2>\n\n\n\n

WordPress, one of the most popular blogging platforms on the web, offers a solution called Infinite Scroll. As its name suggests, Infinite Scroll constantly loads content as the user scrolls down the page. The page footer, which is usually not available on an infinitely loaded web page, appears as an overlay below the scrolling content. WordPress claims that users read more posts when Infinite Scroll is enabled, as opposed to the traditional page-based approach.

Google takes a different approach to image search results. As the user scrolls down the page, the placeholder images are replaced by thumbnails. After displaying a certain number of images, a button can be used to load additional images. By providing this button, Google combines infinity Scroll and Lazy Loading to create a dynamic hybrid approach.<\/p>\n\n\n

\n
\"laptop
User Friendly Solution<\/figcaption><\/figure>\n<\/div>\n\n\n

Advantages of lazy loading<\/h2>\n\n\n\n