Devo incluir a marcação HTML na minha resposta JSON?

13

Em um site de comércio eletrônico, ao adicionar um item a um carrinho, eu gostaria de mostrar uma janela pop-up com as opções que você pode escolher. Imagine que você está comprando um iPod Shuffle e agora precisa escolher a cor e o texto a gravar.

Gostaria que a janela fosse modal, então estou usando uma mesa de luz preenchida por uma chamada do Ajax. Agora eu tenho duas opções:

Opção 1: envie apenas os dados e gere a marcação HTML usando JavaScript

O que é legal nisso é que ele reduz a solicitação do Ajax ao mínimo possível e não mistura os dados com a marcação.

O que não é tão bom nisso é que agora eu preciso usar JavaScript para fazer minha renderização, em vez de ter um mecanismo de modelo no lado do servidor. Talvez eu consiga limpar um pouco a abordagem usando uma solução de modelo do cliente .

Opção 2: envie a marcação HTML

O que é bom nisso é que posso ter o mesmo mecanismo de modelagem do lado do servidor que estou usando para o resto das minhas tarefas de renderização (Django), fazer a renderização da mesa de luz. JavaScript é usado apenas para inserir o fragmento HTML na página. Portanto, deixa claramente a renderização no mecanismo de renderização. Faz sentido para mim.

Mas não me sinto confortável misturando dados e marcação em uma chamada do Ajax por algum motivo. Não sei ao certo o que me deixa desconfortável com isso. Quero dizer, é da mesma maneira que todas as páginas da web são exibidas - dados mais marcação - certo?

— Mike M. Lin
fonte

Ótima pergunta. Mas parece pertencer ao stackoverflow.

— Saeed Neamati

1

As questões de design do software @SaeedNeamati, especialmente as questões conceituais do quadro branco y como esta, estão aqui no tópico e fora do tópico no Stack Overflow .

10

JSON deve conter apenas os dados e nenhuma marcação. A longo prazo, essa abordagem é mais extensível, pois existe o potencial de usar os dados JSON em outras partes do site. Se você incluir a marcação, o uso dos mesmos dados para preencher outro modelo se tornará muito mais difícil.

— davidk01
fonte

2

Ótimo ponto sobre a reutilização. Todo mundo parece estar votando na solicitação do Ajax para conter apenas dados e nenhuma marcação por vários motivos. Mas este é um grande problema . Obrigado.

— Mike M. Lin

2

Sem mencionar que o JSON sem marcação é menor e usa menos largura de banda.

@JackManey: Também é um bom argumento. Mas o custo real de largura de banda adicional não é tanto depois que você já come o custo da solicitação HTTP. E posso imaginar algumas configurações nas quais você sabe que as máquinas clientes são tão ruins que custariam mais para gerar o DOM em tempo real usando JavaScript. Pense: aplicativos internos com usuários em máquinas / navegadores antigos.

— Mike M. Lin

3

Eu enviaria os dados na solicitação e criaria a marcação em js. Um benefício extra seria que haveria menos uso de largura de banda. É uma preferência pessoal, mas manter a marcação do lado do cliente longe do servidor é provavelmente uma idéia melhor. Também tenho um site Django e só uso o sistema de modelos para colocar algumas variáveis json na página (menos uma requisição ajax a ser criada) e usar arquivos src ao desenvolver na minha máquina. Todo o lado do cliente é feito com ExtJS.

— reclamar
fonte

Gosto da sua ideia de gravar os dados JSON na página - não aqui, pois não busco os dados adicionais até saber qual item você está adicionando ao seu carrinho. Fazendo uma solicitação para o layout da página, um segundo para os dados parece ser comum atualmente. Ter os dados em uma variável JavaScript elimina a necessidade da segunda solicitação HTTP sem ter dois bits diferentes de código de renderização (ou seja, cliente e servidor).

— Mike M. Lin

Ah, eu vejo que seu servidor não é avançado o suficiente para saber o que o usuário colocará no carrinho de antemão;).

— pllee

1

Eu acho que você falou sobre os prós e contras de ambos. Por que não olhar para uma terceira opção de gerar o javascript para sua mesa de luz a partir de uma exibição do django. Então seu JSON contém apenas os dados para atualizá-lo para cada visualização?

O que você deve ser capaz de fazer é agrupar todo o código de modelo em variáveis javascript e, em seguida, produzi-lo com javascript após receber a solicitação JSON no lado do cliente.

— Ryan Gibbons
fonte

Obrigado pela resposta. Na verdade, foi isso que eu quis dizer com a opção 1. A caixa de luz como um contêiner seria queimada na página, mas oculta. Os dados JSON da solicitação Ajax seriam usados para gerar o conteúdo no contêiner. Parte desse conteúdo seria marcado usando HTML. Como você interpretou a opção 1? Talvez essa seja a minha terceira opção.

— Mike M. Lin

Eu estava pensando algo ao longo das linhas deste stackoverflow.com/questions/6008908/... em seguida, usando JSON para substituir os dados após a carga inicial

— Ryan Gibbons

0

Você deve usar o mecanismo de modelo para marcação e manter um campo oculto em algum lugar para armazenar valores, que você pode encontrar no documento usando um seletor.

— Alex
fonte