CSS: ¿Qués Houdini?



Houdini es un término que utiliza la comunidad para describir el conjunto de APIs de los navegadores útiles para mejorar el desarrollo de CSS en general. Estas APIs permiten extender las posibilidades de CSS con la ayuda de JavaScript. Como resultado de su utilización se consigue una mayor eficiencia en la rapidez y estabilidad en la ejecución de una web comparada con métodos más tradicionales.

La especificación de este término agrupa sus dos APIs en dos categorías: Alto nivel y Bajo nivel.

Las APIs de alto nivel están muy vinculadas a los procesos de renderizado del navegador (estilos, layouts, impresión en pantalla, composición). Incluyes:
  • Paint API: Para controlar el renderizado donde las propiedades visuales son determinadas, propiedades como color, fondo, bordes, etc.
  • Layout API: Se encarga de las dimensiones, de la posición y la alineación.
  • Animation API: Se encarga de la animación de layouts en la pantalla del navegador.
Las APIs de bajo nivel se encargan de trabajar con las funciones menos visuales del navegador:
  • Typed Object Model API
  • Custom Properties & Values API
  • Font Metrics API
  • Worklets
Algunas APIs están disponibles para todos los navegadores, otras solo funcionan con algunos, así que te recomiendo que antes de usarlas investigues si los navegadores más utilizados las utilizan.

Espero que os sea de utilidad ^_^.

Comentarios