Best practice best-practices
La creazione di un’app AEM Mobile On-demand Services è diversa dalla creazione di un’app che viene eseguita direttamente nella shell Cordova (o PhoneGap). Gli sviluppatori devono avere familiarità con:
- Plug-in supportati out-of-the-box e plug-in specifici di AEM Mobile.
-
I modelli che utilizzano la funzionalità dei plug-in devono essere scritti in modo tale che siano ancora modificabili nel browser, senza che il bridge del plugin sia presente.
- Ad esempio, assicurati di aspettare il deviceready prima di tentare di accedere all’API di un plug-in.
Linee guida per gli sviluppatori AEM guidelines-for-aem-developers
Le seguenti linee guida aiuteranno gli sviluppatori esperti AEM per i siti che desiderano creare modelli e componenti per app mobili:
Struttura AEM modelli di siti per incoraggiare il riutilizzo e l’estensibilità
-
Preferisce più file di script componenti su un singolo file monolitico
- Vengono forniti diversi punti di estensione vuoti, ad esempio customheaderlibs.html e customfooterlibs.html, che consente allo sviluppatore di modificare il modello di pagina mentre duplica il minor numero possibile di codice di base
- I modelli possono quindi essere estesi e personalizzati tramite Sling's sling:resourceSuperType meccanismo
-
Preferisci Sightly/HTL su JSP come linguaggio template
- L'utilizzo di questo incoraggia una separazione del codice dal markup, offre una protezione XSS integrata e ha una sintassi più familiare
Ottimizzare le prestazioni su dispositivi
- Lo script specifico per l'articolo e i fogli di stile devono essere inclusi nel payload dell'articolo, utilizzando il modello di sincronizzazione dei contenuti dps-article
- Gli script e i fogli di stile condivisi da più di un articolo devono essere inclusi nelle risorse condivise tramite il modello contentsync dps-HTMLResource
- Non fare riferimento a script esterni che bloccano il rendering
Preferisci librerie JS e CSS lato client specifiche per l’app rispetto a librerie specifiche per il web
- Per evitare sovraccarichi in librerie come jQuery Mobile per gestire un’enorme quantità di dispositivi e browser
- Quando un modello è in esecuzione nella visualizzazione web di un'app, hai il controllo sulle piattaforme e sulle versioni che l'app supporterà, nonché sulla conoscenza che sarà presente il supporto JavaScript. Ad esempio, preferisci Ionic (forse solo il CSS) rispetto all’interfaccia utente jQuery Mobile e Onsen rispetto alla Bootstrap.
Preferisci le microlibrerie a tutto stack
- Il tempo necessario per inserire i contenuti nel vetro del dispositivo verrà rallentato da ogni libreria da cui dipendono gli articoli. Questo rallentamento viene aggravato quando si utilizza una nuova visualizzazione Web per il rendering di ogni articolo, in modo che ogni libreria debba essere inizializzata di nuovo da zero
- Se gli articoli non sono generati come SPA (app a pagina singola), probabilmente non è necessario includere una libreria di stack completa come ad Angular
- Preferisci librerie a scopo singolo più piccole per aggiungere l’interattività necessaria per la pagina, ad esempio Fastclick o Velocity.js
Ridurre al minimo le dimensioni del payload dell’articolo
- Utilizzare le risorse più piccole possibili che possono coprire efficacemente il più grande riquadro di visualizzazione che si sta supportando, a una risoluzione ragionevole
- Usa uno strumento come ImmagineOptim sulle immagini per rimuovere eventuali metadati in eccesso
Come procedere getting-ahead
Per ulteriori informazioni sugli altri due ruoli e responsabilità, consulta le risorse seguenti: