Vantaggi e svantaggi della creazione di un'applicazione Web a pagina singola [chiuso]


52

Mi sto avvicinando alla fine di una fase di prototipazione / dimostrazione del concetto per un progetto laterale a cui sto lavorando e sto cercando di decidere su alcune decisioni di progettazione di applicazioni su larga scala. L'app è un sistema di gestione del progetto più adatto al processo di sviluppo agile. Una delle decisioni che devo prendere è se utilizzare o meno un'applicazione tradizionale a più pagine o un'applicazione a pagina singola.

Attualmente il mio prototipo è una configurazione multi-pagina tradizionale, tuttavia ho cercato backbone.js per ripulire e applicare una struttura al mio codice Javascript (jQuery). Sembra che mentre backbone.js possa essere utilizzato in applicazioni multipagina, brilla di più con le applicazioni a pagina singola. Sto cercando di elaborare un elenco di vantaggi e svantaggi dell'utilizzo di un approccio alla progettazione di applicazioni a pagina singola. Finora ho:

vantaggi

  • Tutti i dati devono essere disponibili tramite una sorta di API: questo è un grande vantaggio per il mio caso d'uso in quanto voglio avere comunque un'API per la mia applicazione. In questo momento circa il 60-70% delle mie chiamate per ottenere / aggiornare i dati viene effettuato tramite un'API REST. Fare un'applicazione a pagina singola mi consentirà di testare meglio la mia API REST poiché l'applicazione stessa la utilizzerà. Significa anche che man mano che l'applicazione cresce, l'API stessa crescerà poiché questo è ciò che l'applicazione utilizza; non è necessario mantenere l'API come componente aggiuntivo dell'applicazione.

  • Applicazione più reattiva: poiché tutti i dati caricati dopo la pagina iniziale sono ridotti al minimo e trasmessi in un formato compatto (come JSON), le richieste di dati dovrebbero generalmente essere più veloci e il server eseguirà leggermente meno elaborazioni.

svantaggi

  • Duplicazione del codice, ad esempio il codice del modello. Dovrò creare modelli sia sul lato server (PHP in questo caso) sia sul lato client in Javascript.
  • Logica aziendale in Javascript - Non posso fornire esempi concreti sul perché ciò sarebbe negativo, ma non mi sembra giusto avere una logica aziendale in Javascript che chiunque possa leggere.
  • Perdite di memoria Javascript: poiché la pagina non viene mai ricaricata, possono verificarsi perdite di memoria Javascript e non saprei nemmeno da dove iniziare il debug.

Ci sono anche altre cose che sono una specie di spade a doppio taglio. Ad esempio, con le applicazioni a pagina singola, i dati elaborati per ogni richiesta possono essere molto meno poiché l'applicazione richiederà i dati minimi necessari per la richiesta particolare, tuttavia significa anche che potrebbero esserci molte più piccole richieste da il server. Non sono sicuro che sia una cosa positiva o negativa.

Quali sono alcuni dei vantaggi e degli svantaggi delle applicazioni Web a pagina singola che dovrei tenere a mente quando decido in che direzione devo andare per il mio progetto?


Basecamp , la nuova versione di basecamphq sta facendo un ottimo lavoro con la configurazione della pagina singola IMO.
Hakan Deryal,

Puoi trovare perdite di memoria con l'heap inspector di Chrome
Joeri Sebrechts

obbligatorio xkcd.com/1309
Pieter B,

Risposte:


17

Il più grande svantaggio è che il client deve avere JavaScript abilitato ed essere abbastanza potente da eseguirne una buona parte. È anche più difficile soddisfare i problemi di accessibilità o qualsiasi altra cosa che si basi sull'analisi dell'HTML statico (anche se qualcosa che conosce l'API specifica può probabilmente fare meglio dello scraping HTML). Infine, è più facile avere perdite di memoria significative.

Per quanto riguarda la duplicazione del codice o l'inserimento della logica aziendale sul client, non sono sicuro di quanto devi fare. Se il modello sul client è un View-Model (un modello che corrisponde al mondo come lo vede l'interfaccia utente, non un modello di business), la logica che corrisponde al ViewModel al modello di business può risiedere sul client, il server o un po 'di entrambi. Dipende da come ritieni che la tua API contenga una facciata specifica per il cliente piuttosto che il client traduca gli input dell'interfaccia utente in chiamate API.

Potresti anche voler dare un'occhiata a knockout.js. Non posso dire se è meglio della spina dorsale ma potrebbe adattarsi meglio al tuo progetto.


Sì, immagino che la maggior parte della duplicazione del codice ci sarà la convalida dei dati che va bene. Sto bene avendo il requisito di abilitare JavaScript in quanto non mi preoccupo dell'accessibilità per questo progetto (come screen reader e cosa no). Per quanto riguarda il problema delle perdite di memoria javascript che era una mia preoccupazione, con il link fornito nei commenti della mia domanda, ciò lo nega davvero (Chrome è comunque il mio browser di sviluppo primario).
Ryanzec,

7

Svantaggi che vedo spesso con le applicazioni Web a pagina singola:

  • Impossibilità di collegarsi a una parte specifica del sito, spesso c'è solo 1 punto di ingresso.
  • Pulsanti avanti e indietro non funzionanti.
  • L'uso delle schede è limitato o inesistente.

(soprattutto mobile :)

  • Richiede molto tempo per caricare.
  • Non funziona affatto.
  • Impossibile ricaricare una pagina, un'improvvisa perdita di rete ti riporta all'inizio del sito.

Tutti questi possono essere risolti, ma da quello che ho visto, la maggior parte dei costruttori di siti no.


9
1,2 e 6 sono fondamentalmente solo sinfomi dello stesso problema. Che il creatore non utilizza l'API cronologia / il collegamento hash.
Martin Hansen,

11
Questa risposta è obsoleta, la maggior parte dei framework di applicazioni a pagina singola ha un modo di affrontare i problemi sopra elencati
Luis,

@Luis mentre la tecnologia è lì, troppo spesso non viene utilizzata.
Pieter B,

5

C'è un client importantissimo che non esegue mai Javascript: Google crawler (dal 2012) . (Suppongo che anche Bing non esegua JS.)

Dovrai fornire una versione ragionevole non AJAX di ogni pagina che deve essere indicizzata o collegamenti a una pagina che deve essere indicizzata.

Se il tuo sito è piccolo, puoi fornire versioni molto semplici delle poche pagine solo per indicizzare i robot.

Se la maggior parte dei contenuti del sito è solo per utenti registrati o non è necessario indicizzarli per altri motivi, è possibile creare l'intero spazio non indicizzato come app di una pagina, con la propria ricerca, blackjack, ecc.

Se nessuno di questi, probabilmente stai meglio sviluppando un sito multipagina dall'inizio e fornendo aggiornamenti AJAX solo dove non cambia lo "scopo generale" della pagina.


4
Googlebot ora legge e persino esegue alcuni Javascript. Vedi googlewebmastercentral.blogspot.com/2011/11/…
jfrankcarr

2
Per questa domanda particolare, è un'app di gestione del progetto. Probabilmente non è un sito degno di SEO.
Giordania,

La SEO non è una grande preoccupazione per la maggior parte delle pagine, anche se sarebbe bello essere in grado di SEO singoli problemi poiché sarà configurabile per consentire l'accesso anonimo ad essa (in modo che se un utente cerca su Google un problema che sta avendo con il prodotto, può trova il problema ad esso correlato nel tracker).
Ryanzec,

1
Aggiornamento 2015: Google non esegue JS
rinogo

3

-Duplicazione del codice - Ad esempio, codice modello. Dovrò creare modelli sia sul lato server (PHP nel caso) sia sul lato server in javascript.

Sei nel mondo PHP ma ci sono strategie di generazione del codice nel mondo .NET per la creazione automatica di proxy WCF JavaScript. Vedi qui

Non so quali opzioni potrebbero essere disponibili per non dover creare gli oggetti remoti da soli in JavaScript in un'applicazione PHP, ma questa è un'opzione per coloro che scrivono applicazioni a pagina singola in .NET.


0

La scelta non deve essere l'uno o l'altro. JWt è ad esempio un toolkit Web che implementa la perfetta illusione di una pagina Web multi-pagina, ma è una singola pagina. Inoltre, riconoscerà i bot e i browser di Google che non hanno javascript (provalo) e passerà al modello multipagina tradizionale quando li rileva.

In breve:

  • non c'è bisogno di scrivere un'API (ma puoi ancora, se vuoi)
  • applicazione reattiva: ogni clic dell'utente richiede al massimo un round-trip del server (oltre al recupero delle immagini)
  • nessuna duplicazione del codice
  • nessuna logica di business lato client
  • minima complessità lato client
  • i robot di ricerca possono indicizzarlo

1
JWt è un toolkit Java. La domanda riguarda PHP.
Joeri Sebrechts,
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.