menu move to sidebar hide Navigation Main page Contents Current events Random article About Wikipedia Contact us Contribute Help Learn to edit Community portal Recent changes Upload file Special pages Search Search Appearance Donate Create account Log in Personal tools Donate Create account Log in Contents move to sidebar hide (Top) 1 Examples Toggle Examples subsection 1.1 With web frameworks 1.2 As a web standard 2 Methods Toggle Methods subsection 2.1 Lazy initialization 2.2 Virtual proxy 2.3 Ghost 2.4 Value holder 3 See also 4 References 5 External links Toggle the table of contents Lazy loading 14 languages العربية Čeština Deutsch Español فارسی Magyar Հայերեն 日本語 한국어 Polski Português ไทย Українська 中文 Edit links Article Talk English Read Edit View history Tools Tools move to sidebar hide Actions Read Edit View history General What links here Related changes Upload file Permanent link Page information Cite this page Get shortened URL Print/export Download as PDF Printable version In other projects Wikidata item Appearance move to sidebar hide From Wikipedia, the free encyclopedia Design pattern in computer programming Lazy loading (also known as asynchronous loading ) is a technique used in computer programming , especially web design and web development , to defer initialization of an object until it is needed. It can contribute to efficiency in the program's operation if properly and appropriately used. 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 . For example, deferring loading of images on a web page until they are needed for viewing can make the initial display of the web page faster. The opposite of lazy loading is eager loading . [ 1 ] Examples [ edit ] With web frameworks [ edit ] Prior to being established as a web standard, web frameworks were generally used to implement lazy loading. One of these is Angular . Since lazy loading decreases bandwidth and subsequently server resources, it is a strong contender to implement in a website, especially in order to improve user retention by having less delay when loading the page, which may also improve search engine optimization (SEO). [ 2 ] Below is an example of lazy loading being used in Angular, programmed in TypeScript , from 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 ] }) As a web standard [ edit ] Since 2020, major web browsers have enabled native handling of lazy loading by default. [ 4 ] [ 5 ] This allows lazy loading to be incorporated into a webpage by adding HTML attributes . The loading attribute support two values, lazy and eager . [ 6 ] Setting the value to lazy will fetch the resource only when it is required (such as when an image scrolls into view when a user scrolls down), while setting it to eager , the default state, the resource will be immediately loaded. <!-- 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 > Methods [ edit ] There are four common ways of implementing the lazy load design pattern: lazy initialization ; a virtual proxy ; a ghost , and a value holder . [ 7 ] Each has its own advantages and disadvantages. Lazy initialization [ edit ] Main article: Lazy initialization With lazy initialization, the object is first set to null . Whenever the object is requested, the object is checked, and if it is null , the object is then immediately created and returned. For example, lazy loading for a widget can be implemented in the C# programming language as such: private int _myWidgetID ; private Widget _myWidget = null ; public Widget MyWidget { get { if ( _myWidget == null ) { _myWidget = Widget . Load ( _myWidgetID ); } return _myWidget ; } } Or alternatively, with the null-coalescing assignment operator ??= private int _myWidgetID ; private Widget _myWidget = null ; public Widget MyWidget { get => _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 [ edit ] A 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 [ edit ] A ghost is the object that is to be loaded in a partial state. It may initially 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, the only information available is that content will be accessed, but the specific action and content is unknown. An example in PHP : $userData = array ( "UID" = > uniqid (), "requestTime" => microtime ( true ), "dataType" => "" , "request" => "" ); if ( isset ( $_POST [ 'data' ]) && $userData ) { // ... } Value holder [ edit ] 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 [ edit ] Demand paging Dynamic loading Proxy pattern Lazy evaluation Lazy initialization Software design pattern References [ edit ] ^ "What is Lazy Loading | Lazy vs. Eager Loading | Imperva" . Learning Center . Retrieved 2022-02-02 . ^ "What Is Lazy Loading? Understanding Lazy Loading for SEO" . ^ Fain, Y., Moiseev, A. (2018). Angular Development with TypeScript, Second Edition. December ISBN   9781617295348 . ^ "A Deep Dive into Native Lazy-Loading for Images and Frames" . 15 May 2019. ^ "Firefox 75 gets lazy loading support for images and iframes" . 15 February 2020. ^ "Lazy loading - Web Performance | MDN" . developer.mozilla.org . Retrieved 2022-03-15 . ^ Martin Fowler (2003). Patterns of Enterprise Application Architecture . Addison-Wesley. pp.  200– 214. ISBN   0-321-12742-0 . External links [ edit ] Lazy Loading, Mozilla Developer Network URLs, WHATWG HTML Standard JS Lazy Loading v t e Software design patterns Gang of Four patterns Creational Abstract factory Builder Factory method Prototype Singleton Structural Adapter Bridge Composite Decorator Facade Flyweight Proxy Behavioral Chain of responsibility Command Interpreter Iterator Mediator Memento Observer State Strategy Template method Visitor Concurrency patterns Active object Balking Binding properties Double-checked locking Event-based asynchronous Guarded suspension Join Lock Monitor Proactor Reactor Read–write lock Scheduler Scheduled-task pattern Semaphore Thread pool Thread-local storage Architectural patterns Front controller Interceptor MVC MVP MVVM ADR ECS n -tier Specification Publish–subscribe Naked objects Service locator Active record Identity map Data access object (DAO) Data transfer object (DTO) Inversion of control Model 2 Broker Other patterns Blackboard Business delegate Composite entity Composition over inheritance Dependency injection Guard clause Intercepting filter Lazy loading Mock object Null object Object pool Servant Twin Type tunnel Method chaining Delegation Books Design Patterns Enterprise Integration Patterns People Christopher Alexander Erich Gamma Ralph Johnson John Vlissides Grady Booch Kent Beck Ward Cunningham Martin Fowler Robert Martin Jim Coplien Douglas Schmidt Linda Rising Communities The Hillside Group Portland Pattern Repository See also Anti-pattern Architectural pattern This computer-programming -related article is a stub . You can help Wikipedia by adding missing information . v t e Retrieved from " https://en.wikipedia.org/w/index.php?title=Lazy_loading&oldid=1324650611 " Categories : Software design patterns Computer programming stubs Hidden categories: Articles with short description Short description matches Wikidata Articles with example PHP code All stub articles This page was last edited on 28 November 2025, at 22:06  (UTC) . Text is available under the Creative Commons Attribution-ShareAlike 4.0 License ; additional terms may apply. By using this site, you agree to the Terms of Use and Privacy Policy . Wikipedia® is a registered trademark of the Wikimedia Foundation, Inc. , a non-profit organization. Privacy policy About Wikipedia Disclaimers Contact Wikipedia Legal & safety contacts Code of Conduct Developers Statistics Cookie statement Mobile view Search Search Toggle the table of contents Lazy loading 14 languages Add topic