Ленивая загрузка

Ленивая загрузка (также известная как асинхронная загрузка ) — это метод, используемый в компьютерном программировании , особенно в веб-дизайне и веб-разработке , для отсрочки инициализации объекта до тех пор, пока он не понадобится. При правильном и правильном использовании это может способствовать повышению эффективности работы программы. Это делает его идеальным в случаях использования, когда осуществляется доступ к сетевому контенту и время инициализации должно быть сведено к минимуму, например, в случае веб-страниц . Например, отсрочка загрузки изображений на веб-странице до тех пор, пока они не потребуются для просмотра, может ускорить первоначальное отображение веб-страницы. Противоположностью отложенной загрузки является нетерпеливая загрузка . ^[1]

Примеры

С веб-фреймворками

До того как стать веб-стандартом, веб-фреймворки обычно использовались для реализации отложенной загрузки.

Одним из них является Angular . Поскольку отложенная загрузка уменьшает пропускную способность и, следовательно, ресурсы сервера, она является сильным претендентом на внедрение на веб-сайте, особенно для улучшения удержания пользователей за счет меньшей задержки при загрузке страницы, что также может улучшить поисковую оптимизацию (SEO). ^[2]

Ниже приведен пример отложенной загрузки, используемой в Angular, запрограммированной на TypeScript от Farata Systems. ^[3]

@NgModule({
  imports: [ BrowserModule,
    RouterModule.forRoot([
      {path: '',        component: HomeComponent},
      {path: 'product', component: ProductDetailComponent},

      {path: 'luxury', loadChildren: () => import('./luxury.module').then(m => m.LuxuryModule), data: {preloadme: true} } ]
//      , {preloadingStrategy: CustomPreloadingStrategy}
      )
  ],
  declarations: [ AppComponent, HomeComponent, ProductDetailComponent],
  providers:[{provide: LocationStrategy, useClass: HashLocationStrategy}, CustomPreloadingStrategy],
  bootstrap:    [ AppComponent ]
})

В качестве веб-стандарта

С 2020 года основные веб-браузеры по умолчанию включили встроенную обработку отложенной загрузки. ^[4]^[5]

Это позволяет включить в веб-страницу отложенную загрузку путем добавления атрибутов HTML .

The loading атрибут поддерживает два значения, lazy и eager. ^[6] Установка значения lazy будет извлекать ресурс только тогда, когда это необходимо (например, когда изображение прокручивается в поле зрения, когда пользователь прокручивает вниз), установив для него значение eager, состояние по умолчанию, ресурс будет загружен немедленно.

<!-- These resources will be loaded immediately -->
<img src="header_image.jpg">
<img src="header_image2.jpg" loading="eager">

<!-- While these resources will be lazy loaded -->
<img src="article_image.jpg" alt="..." loading="lazy"> 
<iframe src="video-player.html" title="..." loading="lazy"></iframe>

Методы

Существует четыре распространенных способа реализации шаблона проектирования отложенной загрузки: отложенная инициализация ; виртуальный прокси ; призрак . и ценностей обладатель ^[7] У каждого есть свои преимущества и недостатки.

Ленивая инициализация

При ленивой инициализации объекту сначала присваивается значение null.

Всякий раз, когда объект запрашивается, он проверяется, и если он null, объект немедленно создается и возвращается.

Например, отложенная загрузка виджета может быть реализована на языке программирования C# следующим образом:

private int _myWidgetID;
private Widget _myWidget = null;

public Widget MyWidget
{
    get
    {
        if (_myWidget == null)
        {
            _myWidget = Widget.Load(_myWidgetID);
        }

        return _myWidget;
    }
}

Или, альтернативно, с помощью оператора присваивания, объединяющего нулевые значения. ??=

private int _myWidgetID;
private Widget _myWidget = null;

public Widget MyWidget
{
    get => _myWidget ??= Widget.Load(_myWidgetID);
}

Этот метод наиболее прост в реализации, хотя если null является допустимым возвращаемым значением, может потребоваться использовать объект-заполнитель, чтобы указать, что он не был инициализирован. Если этот метод используется в многопоточном приложении , необходимо использовать синхронизацию, чтобы избежать условий гонки .

Виртуальный прокси

Виртуальный прокси — это объект с тем же интерфейсом, что и реальный объект. При первом вызове одного из его методов он загружает реальный объект, а затем делегирует его.

Призрак

Призрак — это объект, который должен быть загружен в частичном состоянии. Первоначально он может содержать только идентификатор объекта, но загружает свои собственные данные при первом обращении к одному из его свойств. Например, предположим, что пользователь собирается запросить контент через онлайн-форму. На момент создания доступна только информация о том, что к контенту будет осуществляться доступ, но конкретное действие и контент неизвестны.

Пример на PHP :

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

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

Держатель стоимости

Держатель значения — это универсальный объект, который обрабатывает поведение отложенной загрузки и появляется вместо полей данных объекта:

private ValueHolder<Widget> valueHolder;

public Widget MyWidget => valueHolder.GetValue();

См. также

Ссылки

^ «Что такое ленивая загрузка | Ленивая или нетерпеливая загрузка | Imperva» . Учебный центр . Проверено 2 февраля 2022 г.
^ «Что такое ленивая загрузка? Понимание ленивой загрузки для SEO» .
^ Файн Ю., Моисеев А. (2018). Разработка Angular с использованием TypeScript, второе издание. декабрь ISBN 9781617295348 .
^ «Глубокое погружение в нативную отложенную загрузку изображений и фреймов» . 15 мая 2019 г.
^ «В Firefox 75 добавлена поддержка отложенной загрузки изображений и iframe» . 15 февраля 2020 г.
^ «Отложенная загрузка — Веб-производительность | MDN» . http://developer.mozilla.org . Проверено 15 марта 2022 г.
^ Мартин Фаулер (2003). Шаблоны архитектуры корпоративных приложений . Аддисон-Уэсли. стр. 200–214. ISBN 0-321-12742-0 .

Внешние ссылки

Эта компьютерному программированию, статья, посвященная является незавершенной . Вы можете помочь Википедии, расширив ее .

[1] «Что такое ленивая загрузка | Ленивая или нетерпеливая загрузка | Imperva» . Учебный центр . Проверено 2 февраля 2022 г.

[2] «Что такое ленивая загрузка? Понимание ленивой загрузки для SEO» .

[3] Файн Ю., Моисеев А. (2018). Разработка Angular с использованием TypeScript, второе издание. декабрь ISBN 9781617295348 .

[4] «Глубокое погружение в нативную отложенную загрузку изображений и фреймов» . 15 мая 2019 г.

[5] «В Firefox 75 добавлена поддержка отложенной загрузки изображений и iframe» . 15 февраля 2020 г.

[6] «Отложенная загрузка — Веб-производительность | MDN» . http://developer.mozilla.org . Проверено 15 марта 2022 г.

[7] Мартин Фаулер (2003). Шаблоны архитектуры корпоративных приложений . Аддисон-Уэсли. стр. 200–214. ISBN 0-321-12742-0 .

[1]

[2]

[3]

[4]

[5]

[6]

[7]