npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

gifify

v2.4.3

Published

Convert any video file to an optimized animated GIF

Downloads

409

Readme

NOTE FROM AUTHOR

I am no more using this project or providing any support to it, if you want to maintain it, ping me here: [email protected].

This project was created 4 years ago, there might be better ways to turn a video into a GIF now, use google!

/NOTE FROM AUTHOR

gifify

Convert any video file to an optimized animated GIF. Either in its full length or only a part of it.

Demo time

screencast

This screencast was recorded with lolilolicon/FFcast then converted to a GIF with:

gifify screencast.mkv -o screencast.gif --resize 800:-1

Features

  • command line interface
  • programmatic JavaScript (Node.JS) stream interface
  • unix friendly, supports stdin & stdout
  • optimized! uses pornel/giflossy to generate light GIFS
  • lots of options: movie speed, fps, colors, compression, resize, reverse, from & to, subtitles
  • no temp files used, everything happens in memory
  • fast! Extracting a 5-second GIF from the middle of a 2-hour movie takes less than 20 seconds

Requirements

Before using gifify, please install:

You can also use the gifify Docker image which comes with everything installed.

Installation

npm install -g gifify

Command line usage

> gifify -h

  Usage: gifify [options] [file]

  Options:

    -h, --help              output usage information
    -V, --version           output the version number
    --colors <n>            Number of colors, up to 255, defaults to 80
    --compress <n>          Compression (quality) level, from 0 (no compression) to 100, defaults to 40
    --from <position>       Start position, hh:mm:ss or seconds, defaults to 0
    --fps <n>               Frames Per Second, defaults to 10
    -o, --output <file>     Output file, defaults to stdout
    --resize <W:H>          Resize output, use -1 when specifying only width or height. `350:100`, `400:-1`, `-1:200`
    --reverse               Reverses movie
    --speed <n>             Movie speed, defaults to 1
    --subtitles <filepath>  Subtitle filepath to burn to the GIF
    --text <string>         Add some text at the bottom of the movie
    --to <position>         End position, hh:mm:ss or seconds, defaults to end of movie
    --no-loop               Will show every frame once without looping

Programmatic usage

See the example.

var fs = require('fs');
var gifify = require('gifify');
var path = require('path');

var input = path.join(__dirname, 'movie.mp4');
var output = path.join(__dirname, 'movie.gif');

var gif = fs.createWriteStream(output);

var options = {
  resize: '200:-1',
  from: 30,
  to: 35
};

gifify(input, options).pipe(gif);

You can also pass a readable stream to gifify(stream, opts).

Readable stream input performance

Gifify supports streams both on command line (cat movie.mp4 | gifify -o out.gif) and in the programmatic API (gifify(readableStream, opts).pipe(writableStream)).

While it's super useful in some cases, if you have the file on disk already, you better do gifify movie.mp4 -o out.gif or gifify(filePath, opts).pipe(writableStream).

Why? Because piping 3.4GB when you want to cut from 40:20 to 40:22 still takes a loooooot of time and does not give you any performance benefit.

FFmpeg has to read from 0GB -> $START_BYTE_40:20 and discards it. But everything flows in your memory.

When using direct file input from command line, we pass the -i filename option to FFmpeg and then it's super fast!

Be careful when |piping.

Adding some text

You can burn some simple text into your GIF:

gifify back.mp4 -o back.gif --from 01:48:23.200 --to 01:48:25.300 --text "What?..What?What?"

Result:

back

Subtitles

You can burn subtitles into your GIF, it's that easy:

gifify 22.mkv -o movie.gif --subtitles 22.ass --from 1995 --to 2002 --resize 600:-1

You must create new subtitles files, the timecodes for the complete film will not work for a five seconds GIF.

Create subtitles using aegisub and augment the font size for a great effect!

Here's the 22.ass from the previous command, created with aegisub:

[Script Info]
; Script generated by Aegisub 3.2.1
; http://www.aegisub.org/
Title: Default Aegisub file
ScriptType: v4.00+
WrapStyle: 0
ScaledBorderAndShadow: yes
YCbCr Matrix: None

[Aegisub Project Garbage]

[V4+ Styles]
Format: Name, Fontname, Fontsize, PrimaryColour, SecondaryColour, OutlineColour, BackColour, Bold, Italic, Underline, StrikeOut, ScaleX, ScaleY, Spacing, Angle, BorderStyle, Outline, Shadow, Alignment, MarginL, MarginR, MarginV, Encoding
Style: Default,Arial,20,&H00FFFFFF,&H000000FF,&H00000000,&H00000000,0,0,0,0,100,100,0,0,1,2,2,2,10,10,10,1

[Events]
Format: Layer, Start, End, Style, Name, MarginL, MarginR, MarginV, Effect, Text
Dialogue: 0,0:00:02.50,0:00:03.97,Default,,0,0,0,,{\fnLiberation Sans\fs40}Okay, okay.
Dialogue: 0,0:00:05.00,0:00:06.90,Default,,0,0,0,,{\fnLiberation Sans\fs40}Okay. Okay.

Result extracting a GIF from 22 Jump Street:

22

GIF Performance

On modern hardware GIF is the slowest and most expensive video codec. Can we please allow it to be obsoleted?

https://pornel.net/efficient-gifs#sec44

YOLO!

Giflossy

Giflossy is a fork of gifsicle, gifsicle author is currently working on integrating the lossy part in gifsicle.

So in little time we will be able to directly use gifsicle and gifiscle packages.

Thanks

jclem/gifify was a great source of inspiration.