this post was submitted on 05 Sep 2023
19 points (95.2% liked)

Web Development

3454 readers
1 users here now

Welcome to the web development community! This is a place to post, discuss, get help about, etc. anything related to web development

What is web development?

Web development is the process of creating websites or web applications

Rules/Guidelines

Related Communities

Wormhole

Some webdev blogsNot sure what to post in here? Want some web development related things to read?

Heres a couple blogs that have web development related content

CreditsIcon 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 11 comments
sorted by: hot top controversial new old
[–] kornel 14 points 1 year 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.

[–] [email protected] 11 points 1 year 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

[–] [email protected] 3 points 1 year ago (1 children)

What kind of animated site elements?

[–] [email protected] 1 points 1 year 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.

[–] [email protected] 3 points 1 year ago* (last edited 1 year 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.

[–] [email protected] 1 points 1 year ago (1 children)

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

[–] [email protected] 2 points 1 year ago

I figured but thought I’d cover the bases

[–] [email protected] 3 points 1 year ago (1 children)

IMO webm files are ideal as they're extremely small for the quality of video output. Downside is, they can take a while longer to encode compared to mp4s if your hardware can't accelerate it

[–] spartanatreyu 5 points 1 year ago

iOS still has issues with webm >_<.

Best to use a vp9 webm with a h264 mp4 fallback.

Maybe next decade when the EU creates even more laws, Apple will begrudgingly add av1 support and we can all switch to that.

[–] [email protected] 3 points 1 year ago

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

[–] Kalabasa 1 points 1 year ago

Follow-up question: How about transparent animated graphics?