¿Debo incluir el marcado HTML en mi respuesta JSON?

13

En un sitio de comercio electrónico, al agregar un artículo a un carrito, me gustaría mostrar una ventana emergente con las opciones que puede elegir. Imagina que estás pidiendo un iPod Shuffle y ahora tienes que elegir el color y el texto para grabar.

Me gustaría que la ventana sea modal, por lo que estoy usando una caja de luz poblada por una llamada Ajax. Ahora tengo dos opciones:

Opción 1: envíe solo los datos y genere el marcado HTML usando JavaScript

Lo bueno de esto es que reduce la solicitud de Ajax al mínimo de oso y no mezcla los datos con el marcado.

Lo que no es tan bueno de esto es que ahora necesito usar JavaScript para hacer mi renderizado, en lugar de tener un motor de plantillas en el lado del servidor. Podría ser capaz de limpiar un poco el enfoque utilizando una solución de plantillas del lado del cliente .

Opción 2: enviar el marcado HTML

Lo bueno de esto es que puedo tener el mismo motor de plantillas del lado del servidor que estoy usando para el resto de mis tareas de representación (Django), hacer la representación de la caja de luz. JavaScript solo se usa para insertar el fragmento HTML en la página. Por lo tanto, deja claramente la representación al motor de representación. Tiene sentido para mi.

Pero no me siento cómodo mezclando datos y marcas en una llamada de Ajax por alguna razón. No estoy seguro de qué me hace sentir incómodo al respecto. Quiero decir, es la misma forma en que se sirve cada página web: datos más marcado, ¿verdad?

mvc django templates json Mike M. Lin
fuente
Gran pregunta Pero parece pertenecer a stackoverflow.
Saeed Neamati
1
@SaeedNeamati Las preguntas de diseño de software, especialmente las preguntas conceptuales de pizarra blanca como esta, están en el tema aquí y fuera del tema en Stack Overflow .

Respuestas:

10

JSON solo debe contener los datos y ningún marcado. A la larga, este enfoque es más extensible porque existe la posibilidad de utilizar los datos JSON en otras partes de su sitio. Si incluye marcado, usar los mismos datos para llenar otra plantilla se vuelve mucho más difícil.

davidk01
fuente
2
Gran punto sobre la reutilización. Todos parecen estar votando por la solicitud de Ajax para que solo contenga datos, y no marcado, por varias razones. Pero este es uno grande . Gracias.
Mike M. Lin
2
Sin mencionar que JSON sin marcado es más pequeño y usa menos ancho de banda.
@ JackManey: También es un buen punto. Pero el verdadero costo del ancho de banda adicional no es tanto después de que ya se haya comido el costo de la solicitud HTTP. Y puedo imaginar algunas configuraciones en las que sabes que las máquinas cliente son tan malas que te costaría más generar el DOM en tiempo real usando JavaScript. Piense: Aplicaciones internas con usuarios en máquinas / navegadores antiguos.
Mike M. Lin
3

Enviaría los datos en la solicitud y construiría el marcado en js. Un beneficio adicional sería que habría menos uso de ancho de banda. Es una especie de preferencia personal, pero mantener el marcado del lado del cliente alejado del lado del servidor es probablemente una mejor idea. También tengo un sitio web de Django y solo uso el sistema de plantillas para poner algunas variables json en la página (una menos ajax requerida para hacer) y usar archivos src cuando desarrollo en mi máquina. Todo el lado del cliente se realiza con ExtJS.

por favor
fuente
Me gusta su idea de grabar los datos JSON en la página, no aquí, ya que no obtengo los datos adicionales hasta que sé qué artículo está agregando a su carrito. Al hacer una solicitud para el diseño de la página, un segundo para los datos parece ser común en estos días. Tener los datos en una variable de JavaScript elimina la necesidad de la segunda solicitud HTTP sin tener que tener dos bits diferentes de código de representación (es decir, cliente y servidor).
Mike M. Lin
Oh, veo que su servidor no es lo suficientemente avanzado como para saber de antemano lo que el usuario va a poner en el carrito;).
favor el
1

Creo que has hablado sobre los pros y los contras de ambos. ¿Por qué no mirar una tercera opción de generar el javascript para su lightbox desde una vista de django? ¿Entonces su JSON solo contiene los datos para actualizarlo para cada vista?

Lo que debería poder hacer es envolver todo el código de plantilla en variables de JavaScript y luego generarlas con JavaScript después de recibir la solicitud JSON en el lado del cliente.

Ryan Gibbons
fuente
Gracias por la respuesta. Eso es en realidad lo que quise decir en la opción 1. La caja de luz como contenedor se grabaría en la página pero se ocultaría. Los datos JSON de la solicitud de Ajax se utilizarían para generar el contenido en el contenedor. Parte de ese contenido se marcaría con HTML. ¿Cómo interpretaste la opción 1? Quizás esa sea ​​mi tercera opción.
Mike M. Lin
Estaba pensando en algo como este stackoverflow.com/questions/6008908/… y luego usando JSON para reemplazar los datos después de la carga inicial
Ryan Gibbons
0

Debe usar el motor de plantillas para el marcado y mantener un campo oculto en algún lugar para almacenar valores, que luego puede encontrar en el documento utilizando un selector.

Alex
fuente