Mustache (motor de plantillas)

Mustache es un motor de plantillas para web con  implementaciones disponibles para ActionScript, C++, Clojure, CoffeeScript, ColdFusion, Common Lisp, D, Dart, Delphi, Erlang, Fantom, Go, Haskell, Io, Java, JavaScript, Julia, Lua, .NET, Objetive-C, OCaml, Perl, PHP, Pharo, Python, R, Racket, Ruby, Rust, Scala, Smalltalk, Swift, Tcl, CFEngine y XQuery.

Información general
Tipo de programa procesador de plantillas
Lanzamiento inicial 2009 (2009)
Licencia MIT
Versiones
Última versión estable 1.0.224 de junio de 2015
Enlaces

Mustache está considerado como un sistema "sin lógica" ya que carece de sentencias explícitas de control de flujo, como las condicionales if y else o los bucles for. Sin embargo, es posible obtener estructuras repetitivas y evaluación condicional usando etiquetas de sección que procesan listas y lambdas.

Su nombre, "Mustache" (bigote en inglés), se debe a que hace un uso intensivo de las llaves , { }, que recuerdan a un bigote inclinado 90 grados.

Mustache se usa principalmente en aplicaciones web y de celulares.[1][2]

Historia y principios

Mustache-1 estaba inspirado en "ctemplate" y "et",[3] y comenzó como un repositorio de Github a finales de 2009. La primera versión estaba implementada en Ruby, y hacía funcionar plantillas de texto YAML. Sus principios (que todavía preserva) eran:

Los datos de entrada pueden ser una clase, de modo que pueden ser considerados una vista MVC. La plantilla Mustache no hace otra cosa que llamadas a métodos de la vista (de los datos de entrada).[3] Toda la lógica, decisiones y código están contenidos en esta vista, y todo el marcado (p. ej. la salida XML) está contenido en la plantilla. En un contexto MVP: los datos de entrada proceden del presentador MVP y la plantilla Mustache es la vista MVP.

Ejemplos

La plantilla más simple posible:

Hola {{nombre}}

Una plantilla con etiqueta de sección:

{{#x}}
Algo de texto
{{/x}}

Aquí, si x es un valor booleano entonces la etiqueta de sección actúa como una sentencia condicional if, pero si x es un vector entonces actúa como un bucle foreach.

Una plantilla que no genera secuencias de escape:

{{&cuerpo}}

Aquí, si cuerpo contiene HTML, no se usarán secuencias de escape.

Detalles técnicos

Los editores Vim, Emacs, TextMate, Coda, Atom y Kate/KWrite/KDevelop disponen de coloreado de sintaxis.

Muchos marcos de trabajo para webs (p. ej. CakePHP) permiten el uso de plantillas Mustache. La disponibilidad en JavaScript incluye tanto a la programación en el lado del cliente (con muchas populares bibliotecas de JavaScript y marcos AJAX como jQuery, Dojo y YUI), como al JavaScript del lado del servidor, con Node.js y CommonJS.

Especificaciones e implementaciones

Hay disponibles muchas implementaciones del motor Mustache, y todas ellas cumplen una especificación común (véanse los enlaces externos), lo que, para los usuarios finales, da lugar a una sintaxis común.

La última versión (a fecha de enero de 2017) es la 1.1.2, de marzo de 2011.[4]

Todos los motores Mustache de la arquitectura v1.X tienen un método render, una clase Mustache_Compiler y una clase Parser.

Variantes y derivados

Mustache ha inspirado numerosas bibliotecas de plantillas para JavaScript que se basan en su simplicidad original, añadiendo ciertas funcionalidades o usos.

Handlebars

Handlebars.js se describe como:

Handlebars.js es una extensión del lenguaje de plantillas Mustache creado por Chris Wanstrath. Tanto Handlebars.js como Mustache son lenguajes de plantillas sin lógica que mantienen separados el código y la vista, que, como es bien sabido, es como deben estar.[5]

Handlebars es uno de los motores de plantillas más populares en npm, superando incluso a Mustache (con más de 9 millones de descargas durante el mes de diciembre de 2017).

Algunas de las extensiones más importantes de Handlebars respecto de su predecesor son:

  • Helpers en expresiones de bloque (lo que en Mustache se denominan secciones). Los helpers permiten añadir funcionalidad personalizada mediante código escrito por el usuario expresamente para ese bloque. En Mustache, en cambio, la especificación determina la funcionalidad de las secciones, con menos posibilidades de personalización.
  • Rutas anidadas (Mustache sólo permite rutas simples, mientras que Handlebars admite mayores niveles de anidamiento de los objetos). Esto permite:[6]
<h1>{{titulo}}</h1>
<h2>Por {{autor.nombre}}</h2>

Usando el contexto:

var contexto = {
  titulo: "Cómo Handlebars hace más fácil escribir plantillas",
  autor: {
    id: 47,
    nombre: "Nombre del Autor"
  },
  cuerpo: "Handlebars es un poco más fácil para cosas simples."
};

En Mustache esto requeriría, o bien un nuevo bloque para el objeto anidado, o bien deshacer el anidamiento del contexto, lo que resultaría en:[7]

<h1>{{titulo}}</h1>
{{#autor}}
  <h2>Por {{nombre}}</h2>
{{/autor}}
{{! o bien: }}
<h2>Por {{autorNombre}}</h2>

Además, añade otras funcionalidades principalmente para facilitar su uso.

Referencias

  1. "Smashing Mobile Web Development", G. Avola and J. Raasch, 2012. ISBN 9781118348123.
  2. "Functional Programming Applied to Web Development Templates", J. Cady, 2011. MS Project Report.
  3. https://github.com/defunkt/mustache/blob/master/README.md
  4. «Changes». Mustache. GitHub. 20 de marzo de 2011.
  5. wykatz, NPM. «handlebars NPM». Detalles del paquete npm de Handlebars. Node Package Manager. Consultado el 18 de enero de 2018.
  6. Katz, Yehuda. «handlebars.js: Minimal Templating Language». Documentación Oficial de Handlebars. handlebars.js. Consultado el 18 de enero de 2018.
  7. Lehnardt, Jan. «Mustache». Documentación Oficial de Mustache. Mustache. Consultado el 18 de enero de 2018.

Enlaces externos

Este artículo ha sido escrito por Wikipedia. El texto está disponible bajo la licencia Creative Commons - Atribución - CompartirIgual. Pueden aplicarse cláusulas adicionales a los archivos multimedia.