this post was submitted on 05 Sep 2023
18 points (95.0% liked)

Web Development

0 readers
1 users here now

Icon base by Delapouite under CC BY 3.0 with modifications to add a gradient

founded 2 years ago
MODERATORS
 

From what I gather, I don't know that there's a new norm in this regard yet, besides recognizing that gifs are increasingly old & clunky (despite being fun & amusing), and so I don't know if mp4s or webms or something else might be better if wanting to keep a site lightweight while still having some animated elements.

top 9 comments
sorted by: hot top controversial new old
[–] kornel@programming.dev 14 points 2 years ago

Generally yes.

GIF's ancient LZW compression is remarkably ill-suited for modern CPUs, and more expensive than modern algorithms. Combined with significantly larger file sizes, it costs much more to decode, on top of increased costs of transfer and caching.

GIF might have an edge if the animation is very small (<16px, few frames).

It also gets messy if you need to play hundreds of animations. GIF will be terribly inefficient, but also browsers aren't designed to have hundreds of video elements, so both will eat memory in their own way, and it will vary which is worse.

[–] gianni@lemmy.ml 11 points 2 years ago

WebMs encoded with VP9 or even better AV1 are better than GIFs. Decode speed is negligible, especially considering how much more quickly it will load

[–] fidodo@lemm.ee 3 points 2 years ago

A lot of "gifs" are actually served up as mp4s actually

[–] DogMuffins@discuss.tchncs.de 3 points 2 years ago (1 children)

What kind of animated site elements?

[–] ALostInquirer@lemm.ee 1 points 2 years ago (1 children)

Basically any animated visual element where in the past you might have used a gif. I'm thinking more for a casual kind of site rather than anything professional, but with a desire for using more up to date formats that are smaller & quicker to load.

[–] SzethFriendOfNimi@lemmy.world 3 points 2 years ago* (last edited 2 years ago) (1 children)

Animated content? Or site navigation elements, overlays, etc?

If the later go with the image assets svg, png, gif, etc since there’s better support for masking, css animations and so on.

[–] ALostInquirer@lemm.ee 1 points 2 years ago (1 children)

Ah, sorry, not trying to be obtuse, content. I thought by referring to gifs it might make that clear.

[–] SzethFriendOfNimi@lemmy.world 2 points 2 years ago

I figured but thought I’d cover the bases

[–] Kalabasa@programming.dev 1 points 2 years ago

Follow-up question: How about transparent animated graphics?