Siti Web AngularJS: singola SPA o più app/componenti SPA

Question

Questa domanda mi ha infastidito da un po 'di tempo.

Se stai costruendo un sito Web con più funzionalità utilizzando Angular, è meglio costruire un'enorme SPA o suddividere il sito web in "app" funzionali e creare una SPA per ogni app?

Ad esempio, disponiamo di un sito Web di social media con feed di notifica, profilo utente, rapporti e gruppi. Costruiresti tutte queste funzionalità in un'unica SPA, o costruirai 4 diverse SPA e lascerai un percorso di back-end alla SPA corretta?

ad es.

www.mywebsite.foo #/profile/12345/educazione

vs

www.mywebsite.foo/profile/12345#/education

Sono personalmente più a favore della ultimo metodo perché riduce le dimensioni delle app, ma richiede la ricarica della pagina durante la navigazione tra le app.

Answer 1

Mark Collings ha parlato di una cosa al vostro articolo:

https://markwillcollins.silvrback.com/7-things-i-wish-i-knew-about-angularjs

"3. Struttura è fondamentale ..."

Egli suggerisce di pianificare ogni pagina prima di init il lavoro.

E poi, credo, scoprirai quale approccio migliore per le tue esigenze specifiche.

Preferisco isolare in piccoli servizi, perché non vedo il vantaggio di condividere piccoli bit di javascript in una complessa gerarchia di caricamento, utilizzando require.js o un approccio simile.

Answer 2

Quindi, ecco cosa ho imparato e quello che ho fatto:

mio server ha un percorso predefinito:

var express = require('express'); 
    var router = express.Router(); 

    ... 

    router.get('*', function(req, res) { 
    res.sendfile(path.resolve(__dirname + '/../../../build/index.html')); // Send index.html for HTML5Mode 
    }); 

    return router; 

Quindi, posso avere più SPA sul mio sito, perché ho appena inviare diversi html modelli per loro. Un'app in stile HTML5 dovrà scegliere un'app predefinita come sopra.

Cosa appartiene in una singola SPA?

Tutto lo stato che è correlato all'esperienza utente. Sarà complicato condividere lo stato tra le app (ad esempio l'autenticazione). Ovviamente, tutti possono accedere allo stato completo del tuo server.

Quando è utile?

Se si dispone di prototipi che mostrano casi di utilizzo chiaramente diversi, ad es. due tipi di utenti con accessi diversi. Oppure due "luoghi" diversi che avrebbero effettuato il login.

Cosa si può guadagnare?

• Se siete "dashboard" app carichi un mucchio di codice grafico, ma la tua "pagina di destinazione" app non ne ha bisogno, si può fare una migliore esperienza per gli utenti finali.
• Se l'esperienza dell'utente è diversa, è più facile memorizzare il codice diverso in luoghi diversi.
• Nel mio caso, sul server era presente anche un modello di "pagina di destinazione" per il rendering di vantaggi SEO.

Potresti non sapere di cosa hai veramente bisogno finché non lo provi. Quindi consiglierei di raccogliere tutto ciò che dipende da un accesso alla stessa app. E l'app predefinita dovrebbe includere l'esperienza di 'visitatore anonimo'.