Gfycat - Jiffier gifs through HTML5 video conversion

by BeTmAsTeR • 13 years ago

236 72 13 years ago

zobzu• 13 years ago

yes that thanks. gif takes 10x more bandwidth than modern compressed video average (because generally its lower quality)

so fuck gif, really. ive been annoyed by this for a while. even saw sites that find it smart to replace flash videos with gif.

tdumitrescu• 13 years ago

+1 Go F* Yourself Cat

apunic2• 13 years ago

Handy tool for Reddit users

barrkel• 13 years ago

GIF is a terrible format for video, but OTOH it's fairly lightweight for the browser for simple animation. Historically, playing video in the browser has required loading plugins, increasing the attack surface of the browser quite a bit, as well as inflating memory usage, increasing fragility, etc.

HTML5 video is also blocked by my flash blocker. Up until the latest version of Firefox, animated gifs were blocked by my use of image.animation_mode:once in about:config. Providing the element is clickable, the flash blocker makes it easier to play back the desired video on demand.

dopamean2• 13 years ago

Is OTOH really an acronym people are using now?

kristofferR• 13 years ago

AFAIK, yeah.

AndrewDucker• 13 years ago

Earliest usage of the term I can of the term on newsgroups is 1988.

I was certainly using it in the early 90s.

Rayne• 13 years ago

I've seen this used on IRC for approximately 7 years.

Zr40• 13 years ago

but OTOH it's fairly lightweight for the browser for simple animation.

Historically, this hasn't been the case. Certain browsers used to process the entire gif up to the current frame when rendering a new frame, causing long gif animations to slow down progressively.

jffry5• 13 years ago

That sounds like a "feature" which could be used in interesting ways.

rett12• 13 years ago

Gif is terible. APNG are way better but only firefox support them. https://people.mozilla.org/~dolske/apng/demo.html

w1ntermute2• 13 years ago

Been using this on reddit for the past couple of weeks, and it works wonders. It's especially handy on mobile, where bandwidth can be scarce.

But what has really struck me about the mobile experience is that using HTML5 video significantly improves the performance. This is important for GIFs/videos with a high resolution, which as GIFs would not render in real time on my phone (which has an S800, so I can only imagine what the experience must be like on other phones).

jffry5• 13 years ago

I imagine it's because your phone has hardware H.264 decoders, while GIF is being done in CPU.

fosap• 13 years ago

No, every mobile can process a 80ties picture format in tiny resolutions. 90ies computers could do that without a problem without any allocation an needed only a fraction of their cpu. Now we have quadcore cpus clocked at >1 GHz in our mobiles. It's just the saved bandwidth. And, btw, hardware allocation is a way overrated. There is a HEVC software implementation for the iphone. Just compare the complexity of HEVC to GIF.

simonsays1• 13 years ago

That idea originated from https://mediacru.sh/ - I read that article and considered doing my own "gfycat" site, it looks like someone had the motivation to go through with it after all :)

ShakerBaker2• 13 years ago

Look at the whois records

apunic2• 13 years ago

The problem is that html5 video doesn't work everywhere (we actually encode six different videos to cover the most browsers)

Six different videos?? Anyone knows more about html5 video fragmentation and why six videos are required?

jffry5• 13 years ago

They offer the ability to playback in reverse, so I imagine it's three different formats, doubled so that there's a reverse copy of each video.

If I had to guess, they're probably encoding MP4/H.264, WebM/VP8, and Ogg/Theora.

jc4p• 13 years ago

So close:

Note that there are 6 separate encodings -- mp4, webm, and reduced mp4, for forward and reverse

VMG• 13 years ago

that's one hell of a sample video

other than that: awesome

Kiro• 13 years ago

Are you feeling sorry for the kid or the cat?

factorizer• 13 years ago

Both? The parents (or whoever shot that video) are obvious assholes.

fiatpandas• 13 years ago

Imgur should do something like this when people are viewing gifs at the Imgur site itself (as opposed to viewing a hotlinked gif file), automatically replacing the embedded GIF file with a video. I imagine they could save a lot in bandwidth costs

corysama• 13 years ago

As long a imgur promises to never play audio, I think everyone would be very happy with that feature.

derefr• 13 years ago

Or just to play audio only on a second level of activation, like Vine does now.

Scaevolus• 13 years ago

They could serve webp files to browsers that claim to support them in their request headers.

It can confuse users that save files to not actually have a gif, though.

ivanca• 13 years ago

When you right click in chrome it says "Save video as..." so I think that's not a problem.

jffry5• 13 years ago

I love the naming scheme (AdjectiveAdjectiveAnimal) you have used, and wonder whether or not it could hilariously backfire (e.g. the Scunthorpe/Buttbuttinate problem)

kmfrk• 13 years ago

This is like the old ImageShack and PhotoBucket days. The most important thing in deciding between all these competing services is figuring out whose links will still work five years from now.

I guess the pg question here would be: What happens, if imgur decides they want in on the action?

est• 13 years ago

we badly need a copy pastable video format just like gif. The default html5 video is too video-ish not gif-ish enough.

almosnow• 13 years ago

you guys will be acquired by imgur

sergiotapia2• 13 years ago

If someone can create a simple Firefox/Chrome addon that takes imgur .gif links, and automatically converts the URL from this:

    http://i0.kym-cdn.com/photos/images/original/000/666/838/7fb.gif

To this:

    gfycat.com/fetch/http://i0.kym-cdn.com/photos/images/original/000/666/838/7fb.gif

I'm sure it would easily become a top 20 addons hands down.

whoopdedo• 13 years ago

I'm using a greasemonkey script.

https://www.reddit.com/r/gfycat/comments/1s0fip/extension_fo...

imdsm3• 13 years ago

Extension is now published, though there is no fancy art yet:

https://chrome.google.com/webstore/detail/autogfy/aleldfepmn...

Enjoy!

chinhodado• 13 years ago

Can you put the source on Github please?

sergiotapia2• 13 years ago

Wow, this is soooo helpful. Seriously, thanks a bunch for making this. Works just as I envisioned it.

bluemetal• 13 years ago

This extension works really well.

Feature request: I would like to be able to use some kind of wildcard/regex system to select which websites or domains it works on.

zbowling• 13 years ago

Really they should convince imgur to use this tech and replace all gifs directly.

breadtk• 13 years ago

Imgur is pretty profitable [1], they may even want to consider buying this company.

[1] http://www.businessinsider.com/imgur-is-officially-bigger-th...

thousande3• 13 years ago

Firefox, first try:

http://mr-andersen.no/div/send-to-gfycat.xpi

Edit: If you want to inspect the source, download the file and rename the extension to zip.

Edit2: You may have to download the file and drag it into Firefox in order to install.

thousande3• 13 years ago

Renamed to gfycat - Firefox Add-on

https://addons.mozilla.org/en-US/firefox/addon/gfycat-firefo...

Added similar functionality as imdsm's Chrome version, https://news.ycombinator.com/item?id=6976059

JonBons• 13 years ago

If anyone uses RES for reddit I just finished up support for converting gifs to gfycat links with the inline image viewer.

https://github.com/honestbleeps/Reddit-Enhancement-Suite/pul...

prometheuspk2• 13 years ago

Is this now live?

prometheuspk2• 13 years ago

I already made a bookmark for this. Posted the code to some places too.

Splendor• 13 years ago

I wrote a Chrome extension called GfyFetcher that adds a context menu item for fetching gifs with Gfycat: https://chrome.google.com/webstore/detail/gfyfetcher/logiomo...

Source here: https://github.com/engstrom/GfyFetcher

STRML• 13 years ago

This post inspired me to make Imgur-to-gfycat[1][2], which uses the gfycat api to change <img> tags to embedded gfycat objects using gfycat's embed js, and changes anchors to /fetch urls. It's smart enough to change other anchors on a page if it's managed to resolve a gfycat url, and has a few hacks to work well with Reddit Enhancement Suite.

[1] https://chrome.google.com/webstore/detail/imgur-to-gfycat/id... [2] https://github.com/STRML/Imgur-to-Gfycat

puppetmaster3• 13 years ago

The reason for GIF is simple: It autoplays on mobile web reliably.

There is no other reason not to use video.

kkthrowaw• 13 years ago

What format are you converting the GIF to?

bhuga• 13 years ago

Thank god someone is doing this. I'd been looking for a way to dedicate a core of my laptop to animated gifs.

justinph2• 13 years ago

This is excellent. I've been dealing with weather radar images lately, and they're all terrible animated gifs. This sizes them down nicely.

A service like this really needs to support oEmbed. The oEmbed spec is pretty simple and it would make this more widely usable by popular blogging platforms, and make it easier to use on responsive websites. http://oembed.com/

leeoniya• 13 years ago

I've been dealing with weather radar images lately, and they're all terrible animated gifs

actually, weather radar is an ideal use-case for GIFs. they have limited colors, only a few dozen frames which may need to be delayed for a few hundred ms.

you should really try compressing the gifs using something like gifsicle [1], you'll be astounded by the resulting size (use lzw compression), quality and performance (use a global color palette). it will surpass any video you can make.

what GIFs are terrible at is photographs and video. for the majority of graphics and animations they're awesome sauce.

[1] http://www.lcdf.org/gifsicle/

lelandbatey• 13 years ago

As someone who's messed around with gifs a fair amount, I recommend using Imagrmagik over gifscicle since Imagemagik offers far more features and can do a much wider variety of compression on gifs.

justinph2• 13 years ago

You're correct: Radar is pretty well suited for a gif. But, it can still lead to 400kb images that are 150kb when h.264 video. For a mobile connection, that's worth caring about.

tropin• 13 years ago

Is there any way of doing this offline for large animated GIF collections?

phoboslab2• 13 years ago

ffmpeg can load GIFs and encode into about any video format.

aeon10• 13 years ago

you could look at the source of mediacrush for this. https://github.com/MediaCrush/MediaCrush

Edit: It uses ffmpeg

Sir_Cmpwn• 13 years ago

Try MediaCrush. It's been on HN a couple times, and it also does the GIF->HTML5 thing, but it's open-source and has a lot of other benefits, like browser extensions and a nice API.

https://mediacru.sh

Prior discussions: https://news.ycombinator.com/item?id=6773039 and https://news.ycombinator.com/item?id=6189397

Open source: https://github.com/MediaCrush/MediaCrush

Browser extensions: https://mediacru.sh/apps

API: https://mediacru.sh/docs

phoboslab2• 13 years ago

For a cross browser solution that just needs one video file, supports mobile browsers and still has a much smaller file size than GIF try jsmpeg: http://phoboslab.org/log/2013/05/mpeg1-video-decoder-in-java...

_awzg• 13 years ago

I cobbled together a similar service [1] a while back, but lost interest since I figured it wouldn't be profitable. FWIW the tech behind doing something like this is pretty simple, in my case a small shell script that uses imagemagick to dump the frames of the GIF as well as its framerate and then pipes into ffmpeg compiled with x264 and libvpx support.

[1] http://www.qwikgif.com/

ShakerBaker2• 13 years ago

gfycat is awesome!

Gfycat - Jiffier gifs through HTML5 video conversion

Related Stories