{"id":5278,"date":"2020-06-20T18:57:00","date_gmt":"2020-06-20T18:57:00","guid":{"rendered":"https:\/\/azoora.com\/blog\/?p=5278"},"modified":"2020-08-23T19:04:00","modified_gmt":"2020-08-23T19:04:00","slug":"lazyload-js-pure-javascript-library-for-lazy-loading-images-videos","status":"publish","type":"post","link":"https:\/\/azoora.com\/blog\/code\/lazyload-js-pure-javascript-library-for-lazy-loading-images-videos\/","title":{"rendered":"lazyload.js: Pure JavaScript Library For Lazy Loading Images &#038; Videos"},"content":{"rendered":"\n<p><strong>LazyLoad <\/strong>is a lightweight (2.4 kB) and flexible script that\u00a0<strong>speeds up your web application<\/strong>\u00a0by deferring the loading of your below-the-fold images, videos and iframes to\u00a0<strong>when they will enter the viewport<\/strong>. It&#8217;s written in plain &#8220;vanilla&#8221; JavaScript, it leverages the\u00a0<a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/Intersection_Observer_API\">IntersectionObserver<\/a>\u00a0API, it supports\u00a0<a href=\"https:\/\/alistapart.com\/article\/responsive-images-in-practice\">responsive images<\/a>, it optimizes your website for slower connections, and can enable native lazy loading. See\u00a0<a href=\"https:\/\/github.com\/verlok\/vanilla-lazyload#-notable-features\">notable features<\/a>\u00a0for more.<\/p>\n\n\n\n<blockquote class=\"wp-block-quote\"><p><strong>Author<\/strong>: verlok<\/p><p><strong>Official Page<\/strong>: <a href=\"https:\/\/github.com\/verlok\/vanilla-lazyload\">GitHub<\/a><\/p><p><strong>Demo&#8217;s<\/strong>: <a href=\"https:\/\/github.com\/verlok\/vanilla-lazyload#-demos\">Link<\/a><\/p><p><strong>Download<\/strong>: <a href=\"https:\/\/github.com\/verlok\/vanilla-lazyload\/archive\/master.zip\">Link<\/a><\/p><\/blockquote>\n","protected":false},"excerpt":{"rendered":"<p>LazyLoad is a lightweight (2.4 kB) and flexible script that\u00a0speeds up your web application\u00a0by deferring the loading of your below-the-fold images, videos and iframes to\u00a0when they will enter the viewport. It&#8217;s written in plain &#8220;vanilla&#8221; JavaScript, it leverages the\u00a0IntersectionObserver\u00a0API, it supports\u00a0responsive images, it optimizes your website for slower connections, and can enable native lazy loading. [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":5279,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"spay_email":"","jetpack_publicize_message":"","jetpack_is_tweetstorm":false},"categories":[4,145,12],"tags":[25,146,87,217],"jetpack_featured_media_url":"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2020\/08\/lazyload.js.png","jetpack_publicize_connections":[],"jetpack_shortlink":"https:\/\/wp.me\/p7FQPL-1n8","jetpack-related-posts":[],"jetpack_sharing_enabled":true,"jetpack_likes_enabled":true,"_links":{"self":[{"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/posts\/5278"}],"collection":[{"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/comments?post=5278"}],"version-history":[{"count":1,"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/posts\/5278\/revisions"}],"predecessor-version":[{"id":5280,"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/posts\/5278\/revisions\/5280"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/media\/5279"}],"wp:attachment":[{"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/media?parent=5278"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/categories?post=5278"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/tags?post=5278"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}