Web Development Beginner

What is Lazy Loading?

A technique that delays loading non-critical resources until they are needed, improving initial page load performance.

Lazy loading defers loading of off-screen images, videos, and code until the user scrolls near them. Native HTML supports this with loading="lazy" on img and iframe elements. JavaScript Intersection Observer API enables custom lazy loading.

Benefits include faster initial page load, reduced bandwidth usage, and lower server load. Code splitting (dynamic imports) applies lazy loading to JavaScript modules. Popular in infinite scroll implementations and image-heavy sites.

Learn More About This Topic

JavaScript ES6+ Modern Features

Related reading

JavaScript Fundamentals

Related reading

Laravel Framework Fundamentals

Related reading

Related Terms

A mechanism where a server sends real-time HTTP POST notifications to a specified URL when specific events occur.

A two-dimensional CSS layout system for creating complex grid-based designs with rows and columns.

WebAssembly (Wasm)

A binary instruction format that enables near-native performance execution of code in web browsers alongside JavaScript.

HTTP Status Codes

Standardized three-digit codes returned by web servers to indicate the result of a client's HTTP request.

A JavaScript file that runs in the background, enabling offline support, push notifications, and background sync for web apps.

A query language for APIs that lets clients request exactly the data they need, reducing over-fetching and under-fetching.

View All Web Development Terms →