SVG sin SMIL: Google Chrome elimina el soporte

Ya debería ser de conocimiento común que se pueden crear gráficos interesantes, ilustraciones y animaciones complejas utilizando el formato SVG. SVG proporciona tres formas diferentes de crear animaciones. Junto a las animaciones JavaScript y CSS3, SMIL es otro enfoque para hacer que las formas se muevan. Sin embargo, con Chrome 45, Google clasificó las animaciones SMIL como obsoletas y no las admitirá en el futuro. ¿Por qué Google hizo eso? ¿Qué necesitan saber los desarrolladores web ahora?

La historia de SMIL

SMIL es la abreviatura de «Lenguaje de integración multimedia sincronizada» y presenta una forma sencilla de animar elementos SVG de muchas maneras diferentes. Para hacerlo, uno de los elementos SMIL „“, „“ o „“ se utiliza como un “hijo” del elemento que desea animar. Junto a los movimientos simples, también son posibles la rotación, la escala y el cambio de forma.

<rect x="0" y="0" width="100" height="100">
  <animate attributeName="x" from="0" to="500" dur="5s" />
</circle>

El ejemplo anterior muestra cómo se mueve un rectángulo en el eje x a través de un elemento „“. Aunque las animaciones SVG solo han ganado popularidad últimamente, los primeros enfoques SMIL tienen más de 15 años. 1999, SMIL 1.0 fue aprobado por el W3C y en 2008, se aprobó la actual versión 3.0.

SMIL no solo es adecuado para el formato SVG y la creación de animaciones. Como su nombre ya lo dice, el lenguaje de marcado se usa para implementar contenido multimedia. Es por eso que SMIL también se puede usar para formatos de audio y video. El formato HD DVD, por ejemplo, utiliza SMIL para proporcionar contenido interactivo a través de HTML, CSS y SMIL.

La versión 2.0 agregó opciones de animación para el formato SVG en 2001.

SMIL: Compañía de dos, multitud de tres.

A pesar de la sintaxis simple y la larga historia de SMIL, Google ha decidido dejar de admitir el lenguaje de marcado en su navegador Chrome. Aquellos que abran un gráfico SVG con animación SMIL en Chrome 45 verán una pantalla que dice que SMIL está obsoleto y que debe cambiar a CSS o animaciones web.

Sugerencias en las herramientas para desarrolladores de Chrome

La razón por la que Chrome renuncia a SMIL es la falta de soporte para todos los grandes navegadores. Ni Internet Explorer ni el nuevo Edge pueden funcionar con SMIL y no podrán hacerlo en el futuro. Es por eso que los usuarios de los navegadores de Microsoft siempre quedan excluidos cuando se utiliza SMIL.

Además de eso, hay otras dos formas de animar formas SVG. Es decir, las populares animaciones CSS3 «transición» y «animación» en combinación con «@keyframes» también están disponibles para el formato SVG.

Existen las llamadas animaciones web para animaciones más complejas que requieren cálculos. Estas animaciones se pueden realizar utilizando el método «animate()» de JavaScript.

La falta de soporte de Microsoft y las alternativas existentes han hecho que Google abandone su soporte SMIL.

Desventajas de renunciar a SMIL

CSS3 y Web Animations pueden hacer mucho de lo que SMIL puede hacer. Los movimientos simples en los ejes x e y, el escalado y la rotación se pueden realizar con CSS3 sin ningún problema. Sin embargo, una cosa plantea un problema, al menos por el momento. SMIL hace que sea muy fácil crear una transformación animada entre dos formas.

CSS3 y Web Animations no ofrecen esta opción. Sin bibliotecas de JavaScript adicionales, esta transformación no se puede realizar sin SMIL o sin grandes esfuerzos de programación.

Qué deben hacer los desarrolladores

Incluso cuando SMIL ahora se clasifica como obsoleto, el soporte no se prohíbe instantáneamente en Chrome. Sin embargo, para proyectos futuros, otras opciones de animación y bibliotecas como SVG.js o Snap.svg debería ser usado.

Una alternativa a SMIL: Snap.svg

En el grupo de Google para Chromium, hay algunas voces que critican explícitamente y piden a los desarrolladores de Chrome que continúen con el soporte de SMIL. Aunque SMIL actualmente no disfruta de un uso prolongado, no existe una alternativa que pueda reemplazar la gama completa de funciones de SMIL.

También se critica el hecho de que la aplicación SMIL relativamente simple tiene que ser reemplazada por una animación JavaScript compleja. No se puede predecir el desarrollo del tema SVG en los próximos meses y años y cómo reaccionarán otros proveedores de navegadores. Sólo el tiempo dirá.

(dpe)