Estoy comenzando a migrar algunas tareas de generación de html desde un marco del lado del servidor al cliente. Estoy usando jQuery en el cliente. Mi objetivo es obtener datos JSON a través de una API REST y usar estos datos para llenar HTML en la página.Marcos de plantillas del lado del cliente para agilizar el uso de jQuery con REST/JSON
En este momento, cuando un usuario hace clic en mi sitio un enlace a Mis proyectos, el servidor genera HTML así:
<dl>
<dt>Clean Toilet</dt>
<dd>Get off your butt and clean this filth!</dd>
<dt>Clean Car</dt>
<dd>I think there's something growing in there...</dd>
<dt>Replace Puked on Baby Sheets</dt>
</dl>
voy a cambiar esto para que al hacer clic Mis proyectos a partir de ahora Haga una petición GET que devuelve algo como esto:
[
{
"name":"Clean Car",
"description":"I think there's something growing in there..."
},
{
"name":"Clean Toilets",
"description":"Get off your butt and clean this filth!"
},
{
"name":"Replace Puked on Baby Sheets"
}
]
ciertamente puedo escribir código personalizado de jQuery para tomar esa JSON y generar el código HTML de la misma. Esta no es mi pregunta, y no necesito consejos sobre cómo hacer eso.
Lo que me gustaría hacer es separar por completo la presentación y el diseño de la lógica (código de jquery). No quiero crear elementos DL, DT y DD a través del código jQuery. Prefiero usar algún tipo de plantillas HTML en las que pueda completar los datos. Estas plantillas podrían ser simplemente fragmentos de HTML que están ocultos en la página desde la que se cargó la aplicación. O podrían cargarse dinámicamente desde el servidor (para admitir diseños específicos del usuario, i18n, etc.). Podrían mostrarse una sola vez, así como permitir el bucle y la repetición. Tal vez debería ser compatible con las sub-plantillas, si/then/else, y así sucesivamente.
Tengo MUCHAS listas y contenido en mi sitio que se presentan de muchas maneras diferentes. Estoy buscando crear una forma simple y consistente para generar y mostrar contenido sin crear código jQuery personalizado para cada característica diferente en mi sitio. Para mí, esto significa que necesito encontrar o crear un pequeño marco sobre jQuery (probablemente como un complemento) que cumpla con estos requisitos.
El único tipo de marco que he encontrado que es algo como esto es jTemplates. No sé qué tan bueno es, ya que aún no lo he usado. A primera vista, no estoy emocionado por su sintaxis de plantilla.
¿Alguien sabe de otros marcos o complementos que debería tener en cuenta? ¿Alguna publicación en el blog u otros recursos que discutan sobre este tipo de cosas? Solo quiero asegurarme de haber examinado todo por ahí antes de construirlo yo mismo.
Gracias!
Gracias por su perspectiva, pero en mi caso el punto es alejarse de la generación de HTML del lado del servidor. Cada elemento de datos tiene muchas propiedades, y todo el HTML requerido para ajustar todas estas propiedades aumenta significativamente el tamaño de la respuesta. Cuando multiplico eso por cientos de elementos de datos, mi respuesta HTML puede ser muchas veces mayor que los datos brutos en sí. Como mi aplicación usa ajax y requiere javascript, ¿por qué no simplemente renderizarlo en el navegador? – Tauren
Si hay cientos de elementos de datos, el rendimiento de JavaScript que representa el marcado será mucho peor que el de un lenguaje del lado del servidor como C# o PHP. Combine esto con gzip y el almacenamiento en caché AJAX y ya no es realmente un problema. A menos que realmente esté preocupado por el tiempo de CPU en 2010, entonces no hay una razón real para cargarle al visitante y aumentar el tiempo de renderizado. – tags2k
El tiempo de renderizado y el ancho de banda no son mis únicos motivos para ir en esta dirección. Sin embargo, cualquier computadora no antigua con un navegador reciente no debería cargarse demasiado con la tarea que tengo en mente. ¿Está implicando que el control jqGrid (http://www.trirand.net/demophp.aspx) llevará más tiempo en general para descargar y procesar 1000 filas de datos recuperados a través de JSON/REST que para descargar HTML ya formateado y reemplazar el gridHostHTML con ella? Estoy seguro de que de cualquier manera es bastante insignificante. – Tauren