app/views/layouts/_img_loader.html.haml


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

= javascript_tag do
  :plain
    if ('loading' in HTMLImageElement.prototype) {
      document.querySelectorAll('img.lazy').forEach(img => {
        img.loading = 'lazy';
        let imgUrl = img.dataset.src;
        // Only adding width + height for avatars for now
        if (imgUrl.indexOf('/avatar/') > -1 && imgUrl.indexOf('?') === -1) {
          const targetWidth = img.getAttribute('width') || img.width;
          imgUrl += `?width=${targetWidth}`;
        }
        img.src = imgUrl;
        img.removeAttribute('data-src');
        img.classList.remove('lazy');
        img.classList.add('js-lazy-loaded');
        img.dataset.qa_selector = 'js_lazy_loaded_content';
      });
    }