Lazyload images #1157
Comments
|
Or have something that lets people selectively choose what type of media they want to see. Like #1055. Sometimes I do not want to see profile images, uploaded images, images from outside Twitter, animated GIFs, videos, etc. |
|
Hopefully this could also help with #1109 . |
|
These are the changes needed to enable lazy loading in images:
@@ proc genDate*(pref, state: string): VNode =
- img(src=getPicUrl(url), class=class, alt="")
+ img(src=getPicUrl(url), class=class, loading="lazy", alt="")
@@ const doctype = "<!DOCTYPE html>\n"
- img(class=(prefs.getAvatarClass & " mini"), src=url)
+ img(class=(prefs.getAvatarClass & " mini"), src=url, loading="lazy")
@@ renderVideo*(video: Video; prefs: Prefs; path: string): VNode =
if not video.available:
- img(src=thumb)
+ img(src=thumb, loading="lazy")
renderVideoUnavailable(video)
elif not prefs.isPlaybackEnabled(playbackType):
- img(src=thumb)
+ img(src=thumb, loading="lazy")
@@ proc renderPoll(poll: Poll): VNode =
proc renderCardImage(card: Card): VNode =
buildHtml(tdiv(class="card-image-container")):
tdiv(class="card-image"):
- img(src=getPicUrl(card.image), alt="")
+ img(src=getPicUrl(card.image), alt="", loading="lazy")Then re-build docker image |
alnmy
added a commit
to alnmy/nitter
that referenced
this issue
Feb 26, 2024
This was referenced Feb 26, 2024
Closed
alnmy
added a commit
to alnmy/nitter
that referenced
this issue
Feb 26, 2024
lazyload images: pr zedeus#1157 zedeus/nitter
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Thanks for creating Nitter, it is a joy to use ❤️ - and so much faster than Twitter 🚀
Most pages have lots of images (profile, avatars next to each tweet, shared images in tweet, etc.) so my suggestion is to use the
loadingattribute to only load images when they are visible (lazy loading)https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#loading
It is supported by modern browsers (if unsupported they just ignore it), easy to implement and no javascript is needed.
https://caniuse.com/loading-lazy-attr
This small change will significantly reduce bandwith. 👍
Thanks and have a nice day!
The text was updated successfully, but these errors were encountered: