Lazy loading

Lazy loading is a design pattern commonly used in computer programming to defer initialization of an object until the point at which it is needed. It can contribute to efficiency in the program's operation if properly and appropriately used. The opposite of lazy loading is eager loading. This makes it ideal in use cases where network content is accessed and initialization times are to be kept at a minimum, such as in the case of web pages.

In the general sense, Lazy Loading or "asynchronous loading" refers to loading images asynchronously over the rest of the web content. This means that the browser will start downloading images only after the "Outlook" section of your website is fully loaded and the content is displayed to the audience.

Before discussing Lazy Loading and the like, two questions must be answered.

Question 1: How important is it to speed up our website?

Question 2: How do I load resources on web pages?

Question 1: How important is it to speed up our website [archive]?

In 2016, google found some interesting results:

As you can see in the image above, a 2016 Google search shows that if your website takes more than 3 seconds to load and display, overall, 53% of website visitors will have a window. They shut down their browser and leave the website.

It should be noted, however, that this is a general statistic for all websites [archive] in the world and users in some areas of the region, due to the very slow internet speed and lack of knowledge of the mechanism of the web world, any slowdown in website loading. [archive] They are usually referred to as local internet, so these statistics are likely to be slightly different for some countries, but overall they are correct.

This is just a small example of this. Other research into the speed of website loading and user satisfaction (gaining, maintaining and losing users) can include:

•  Pinterest's Web site increased its traffic and sign-up traffic by up to 15% by reducing "tangible loading time" by 40%. To read the full article on the details of this experiment performed by Pinterest engineers, click this link to move to the Pinterest page on Medium.
• The BBC News website found in a study that it lost 10% of its users per second of delay in loading the website.
  

Think With Google: Lazy Loading

Google Cloud Computing, Home Depot Website Sales (Famous Store of Tools, Home Supplies, etc)

This type of research is a long story and it is not possible to tell it all in a short article, but you can use the Impact Calculator tool provided by Google to understand this.

Unfortunately, this website and some of the other resources we have provided in this article as a reference have been closed down by Google for sanctions reasons and you have to work with them to change IPs and sugar crackers! use. Here's an example for your convenience:

According to Google's calculations, the Home Depot website will add about $ 763,000 to its annual revenue in just 1 second, increasing its page load speed! We hope you have noticed the significant impact on the speed of website loading.

Implementations

There are four common ways of implementing the lazy load design pattern: lazy initialization; a virtual proxy; a ghost, and a value holder. Each has its own advantages and disadvantages.

Lazy initialization

Main article: Lazy initialization

With lazy initialization, the object to be lazily loaded is originally set to null, and every request for the object checks for null and creates it "on the fly" before returning it first, as in this C# example:

private int myWidgetID;
private Widget myWidget = null;

public Widget MyWidget
{
    get
    {
        if (myWidget == null)
        {
            myWidget = Widget.Load(myWidgetID);
        }

        return myWidget;
    }
}

Or with the null-coalescing operator '??'

private int myWidgetID;
private Widget myWidget = null;

public Widget MyWidget
{
    get { return myWidget = myWidget ?? Widget.Load(myWidgetID); }
}

This method is the simplest to implement, although if null is a legitimate return value, it may be necessary to use a placeholder object to signal that it has not been initialized. If this method is used in a multithreaded application, synchronization must be used to avoid race conditions.

Virtual proxy

Virtual Proxy is an object with the same interface as the real object. The first time one of its methods is called it loads the real object and then delegates.

Ghost

A "ghost" is the object that is to be loaded in a partial state. It may only contain the object's identifier, but it loads its own data the first time one of its properties is accessed. For example, consider that a user is about to request content via an online form. At the time of creation all we know is that content will be accessed but what action or content is unknown. PHP Example:

$userData = array (
    "UID" = > uniqid(),
    "requestTime" => microtime(true),
    "dataType" => "",
    "request" => ""
);

if (isset($_POST['data']) && $userData) {
    // ...
}

Value holder

A value holder is a generic object that handles the lazy loading behavior, and appears in place of the object's data fields:

private ValueHolder<Widget> valueHolder;

public Widget MyWidget => valueHolder.GetValue();

See also

• Design pattern
• Proxy
• Lazy inheritance
• Lazy evaluation
• Lazy initialization