examples/index.html

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>LazyLoadable Custom element</title>
</head>
<body>
  <!--
    ## Custom elements
    custom elements instead of querySelectorAll cuz no forEach needed
    better for inifinity scroll when images are not present when the for each loads
    ## src-set instead of data-src use the platform, because removing it will fallback to browser default behaviour
    ## In future all we would
    ## data-src swap techinique is not exactly compatible with picture source
    ##
    lazyload="1" importance="low"
  -->

  <img 
    is="lazy-loadable" 
    loading="lazy" 
    lazyload="1" 
    importance="low" 
    srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" 
    src="https://placekitten.com/400/400" 
    width="400" 
    height="400" 
    alt=""
  >

  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/401/401" width="401" height="401" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/402/402" width="402" height="402" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/403/403" width="403" height="403" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/404/404" width="404" height="404" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/405/405" width="405" height="405" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/406/406" width="406" height="406" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/407/407" width="407" height="407" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/408/408" width="408" height="408" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/409/409" width="409" height="409" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/410/410" width="410" height="410" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/411/411" width="411" height="411" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/412/412" width="412" height="412" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/413/413" width="413" height="413" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/414/414" width="414" height="414" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/415/415" width="415" height="415" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/416/416" width="416" height="416" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/417/417" width="417" height="417" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/418/418" width="418" height="418" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/419/419" width="419" height="419" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/420/420" width="420" height="420" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/421/421" width="421" height="421" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/422/422" width="422" height="422" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/423/423" width="423" height="423" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/424/424" width="424" height="424" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/425/425" width="425" height="425" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/426/426" width="426" height="426" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/427/427" width="427" height="427" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/428/428" width="428" height="428" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/429/429" width="429" height="429" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/430/430" width="430" height="430" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/431/431" width="431" height="431" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/432/432" width="432" height="432" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/433/433" width="433" height="433" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/434/434" width="434" height="434" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/435/435" width="435" height="435" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/436/436" width="436" height="436" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/437/437" width="437" height="437" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/438/438" width="438" height="438" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/439/439" width="439" height="439" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/440/440" width="440" height="440" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/441/441" width="441" height="441" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/442/442" width="442" height="442" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/443/443" width="443" height="443" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/444/444" width="444" height="444" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/445/445" width="445" height="445" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/446/446" width="446" height="446" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/447/447" width="447" height="447" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/448/448" width="448" height="448" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/449/449" width="449" height="449" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/450/450" width="450" height="450" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/451/451" width="451" height="451" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/452/452" width="452" height="452" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/453/453" width="453" height="453" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/454/454" width="454" height="454" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/455/455" width="455" height="455" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/456/456" width="456" height="456" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/457/457" width="457" height="457" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/458/458" width="458" height="458" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/459/459" width="459" height="459" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/460/460" width="460" height="460" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/461/461" width="461" height="461" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/462/462" width="462" height="462" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/463/463" width="463" height="463" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/464/464" width="464" height="464" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/465/465" width="465" height="465" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/466/466" width="466" height="466" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/467/467" width="467" height="467" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/468/468" width="468" height="468" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/469/469" width="469" height="469" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/470/470" width="470" height="470" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/471/471" width="471" height="471" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/472/472" width="472" height="472" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/473/473" width="473" height="473" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/474/474" width="474" height="474" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/475/475" width="475" height="475" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/476/476" width="476" height="476" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/477/477" width="477" height="477" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/478/478" width="478" height="478" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/479/479" width="479" height="479" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/480/480" width="480" height="480" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/481/481" width="481" height="481" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/482/482" width="482" height="482" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/483/483" width="483" height="483" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/484/484" width="484" height="484" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/485/485" width="485" height="485" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/486/486" width="486" height="486" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/487/487" width="487" height="487" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/488/488" width="488" height="488" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/489/489" width="489" height="489" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/490/490" width="490" height="490" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/491/491" width="491" height="491" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/492/492" width="492" height="492" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/493/493" width="493" height="493" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/494/494" width="494" height="494" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/495/495" width="495" height="495" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/496/496" width="496" height="496" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/497/497" width="497" height="497" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/498/498" width="498" height="498" alt="">
  <img is="lazy-loadable" loading="lazy" lazyload="1" importance="low" srcset="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AP///wAI/AL+Sr4t6gAAAABJRU5ErkJggg==" src="https://placekitten.com/499/499" width="499" height="499" alt="">

  <script>
    if (this.customElements) {
      try {
        // feature detect browsers that "forgot" 🙄 to implement built-in extends
        customElements.define('built-in', document.createElement('p').constructor, {'extends':'p'});
      } catch(_) {
        // only WebKit or Safari
        document.write('<script src="//unpkg.com/@ungap/custom-elements-builtin"><\x2fscript>');
      }
    } else {
      // only legacy browsers
      document.write('<script src="//unpkg.com/document-register-element"><\x2fscript>');
    }
  </script>
  <script type="module">
    import LazyLoadable from '../index.js';
    customElements.define('lazy-loadable', LazyLoadable, { extends: "img" });
  </script>
</body>
</html>