Devo includere il markup HTML nella mia risposta JSON?

13

In un sito di e-commerce, quando si aggiunge un articolo a un carrello, vorrei mostrare una finestra popup con le opzioni che puoi scegliere. Immagina di ordinare un iPod Shuffle e ora devi scegliere il colore e il testo da incidere.

Vorrei che la finestra fosse modale, quindi sto usando un lightbox popolato da una chiamata Ajax. Ora ho due opzioni:

Opzione 1: inviare solo i dati e generare il markup HTML utilizzando JavaScript

La cosa bella di questo è che riduce al minimo la richiesta Ajax e non mescola i dati con il markup.

La cosa non eccezionale di questo è che ora ho bisogno di usare JavaScript per fare il mio rendering, invece di fare un motore modello sul lato server. Potrei riuscire a ripulire un po 'l'approccio usando una soluzione di template lato client .

Opzione 2: invia il markup HTML

La cosa positiva di questo è che posso avere lo stesso motore di template lato server che sto usando per il resto delle mie attività di rendering (Django), fare il rendering del lightbox. JavaScript viene utilizzato solo per inserire il frammento HTML nella pagina. Quindi lascia chiaramente il rendering al motore di rendering. Per me ha senso.

Ma non mi sento a mio agio nel mescolare dati e markup in una chiamata Ajax per qualche motivo. Non sono sicuro di cosa mi faccia sentire a disagio. Voglio dire, è allo stesso modo in cui viene pubblicata ogni pagina web - dati più markup - giusto?

— Mike M. Lin
fonte

Ottima domanda Ma sembra appartenere a StackOverflow.

— Saeed Neamati,

1

@SaeedNeamati Le domande di progettazione del software, in particolare le domande concettuali di tipo lavagna come questa, sono in argomento qui e fuori tema su StackTranslate.it .

10

JSON dovrebbe contenere solo i dati e nessun markup. A lungo termine questo approccio è più estensibile perché esiste il potenziale per l'utilizzo dei dati JSON in altre parti del sito. Se si include il markup, l'utilizzo degli stessi dati per popolare un altro modello diventa molto più difficile.

— DavidK01
fonte

2

Ottimo punto sul riutilizzo. Tutti sembrano votare per la richiesta Ajax di contenere solo dati e nessun markup, per vari motivi. Ma questo è grande . Grazie.

— Mike M. Lin,

2

Per non parlare del fatto che JSON senza markup è più piccolo e utilizza meno larghezza di banda.

@JackManey: anche un buon punto. Ma il vero costo della larghezza di banda aggiuntiva non è poi così tanto dopo che hai già consumato il costo della richiesta HTTP. E posso immaginare alcune configurazioni in cui sai che i computer client sono così scadenti che ti costerebbe di più per generare il DOM in tempo reale utilizzando JavaScript. Pensa: app interne con utenti su macchine / browser antichi.

— Mike M. Lin,

3

Vorrei inviare i dati nella richiesta e creare il markup in js. Un ulteriore vantaggio sarebbe che l'utilizzo della larghezza di banda sarebbe inferiore. È una specie di preferenza personale, ma mantenere il markup lato client lontano dal lato server è probabilmente un'idea migliore. Ho anche un sito Web Django e utilizzo il sistema di template solo per mettere alcune variabili json sulla pagina (una ajax req. Da creare) e usare i file src quando sviluppo sulla mia macchina. Tutto il lato client viene eseguito con ExtJS.

— pllee
fonte

Mi piace la tua idea di masterizzare i dati JSON nella pagina, non qui poiché non prendo i dati aggiuntivi fino a quando non so quale articolo stai aggiungendo al carrello. Fare una richiesta per il layout di pagina, quindi un secondo per i dati sembra essere comune in questi giorni. Avere i dati in una variabile JavaScript elimina la necessità della seconda richiesta HTTP senza avere due bit diversi di codice di rendering (client e server).

— Mike M. Lin,

Oh, vedo che il tuo server non è abbastanza avanzato per sapere in anticipo cosa sta per mettere l'utente nel carrello;).

— visita il

1

Penso che tu abbia parlato dei pro e dei contro di entrambi. Perché non guardare una terza opzione per far sì che javascript per il tuo lightbox sia generato da una vista django. Quindi il tuo JSON deve contenere solo i dati per aggiornarlo per ogni vista?

Quello che dovresti essere in grado di fare è avvolgere tutto il codice di template in variabili javascript e quindi inviarli con javascript dopo aver ricevuto la richiesta JSON sul lato client.

— Ryan Gibbons
fonte

Grazie per la risposta. Questo è in realtà ciò che intendevo nell'opzione 1. Il lightbox come contenitore sarebbe stato inserito nella pagina ma nascosto. I dati JSON della richiesta Ajax verrebbero utilizzati per generare il contenuto nel contenitore. Alcuni di questi contenuti verrebbero contrassegnati tramite HTML. Come hai interpretato l'opzione 1? Forse questa può essere la mia terza opzione.

— Mike M. Lin,

Stavo pensando a qualcosa di simile a questo stackoverflow.com/questions/6008908/…, quindi usando JSON per sostituire i dati dopo il caricamento iniziale

— Ryan Gibbons,

0

Dovresti usare il motore del modello per il markup e mantenere un campo nascosto da qualche parte per memorizzare i valori, che puoi trovare nel documento usando un selettore.

— alex
fonte