Si has tuiteado alguna vez un GIF animado, te habrás dado cuenta de que Twitter lo coge y lo convierte a mp4. Yo especulo que hacen dicha conversión, ya que un MP4 está mejor soportado en todas las plataformas, por lo menos en cuanto a que se permite la reproducción/pausa de la animación. Y también porque con un video se puede evitar un bucle infinito, a diferencia de con un GIF animado. Entonces, ¿cómo podemos determinar si un GIF está animado o sin embargo es un GIF estático? En este artículo os muestro algunas soluciones con las que salir de dudas de una vez por todas.
Línea de comando con ImageMagick
ImageMagick, la increíble librería para la manipulación de imágenes, proporciona un método para contar los frames de un GIF concreto:
./ImageMagick-6.9.0/bin/identify -format %n wtf.gif
El comando anterior te proporcionará un recuento de los frames dentro del GIF. Ya sabes, si hay más de un frame es que el GIF es animado.
animated-gif-detector
Para esos que prefieren Javascript, me encontré con una librería muy simple para detectar GIFs animados en NPM: animated-gif-detector. Su API no podría ser más corta:
var fs = require('fs');
var animated = require('animated-gif-detector');
> animated(fs.readFileSync('wtf.gif'));
// true
> animated(fs.readFileSync('blank.gif'));
// false
La llamada a la función simplemente devuelve un true o un false, lo que indica si el GIF está animado o no. Exactamente lo que estábamos buscando, ¿verdad? En cuanto a lo que podemos desprender de la librería, he visto algo de código que no me ha gustado mucho y que no voy a entrar a describir. De todas maneras, si deseas determinar si un GIF es animado, sin embargo, es tan fácil como lo que hemos hecho antes. Con una simple línea de código podemos dictaminar si un GIF está formado por varios frames o simplemente es una imagen estática.
Y este ha sido el tutorial sobre cómo detectar si un GIF es animado en Javascript, esperamos que te haya gustado y sepas aplicarlo en tus futuros proyectos. Ya sabes que si nos quieres proponer un tema que quieres ver reflejado como un tutorial, solo tienes que hacer uso del área de comentarios de un poco más abajo. Por el contrario, si quieres enviarnos tus propios tutoriales, puedes hacerlo a través de la intranet de usuarios que está habilitada para ello, a través del menú Enviar Tutorial. Ya sabes, ayúdanos a crecer con tus conocimientos. ¡Un saludo y feliz código!