AEM 6.4 has reached the end of extended support and this documentation is no longer updated. For further details, see our technical support periods. Find the supported versions here.
Adobe recommends using the SPA Editor for projects that require single page application framework-based client-side rendering (e.g. React). Learn more.
Building an AEM Mobile On-Demand Services App is different than building an app that runs in the Cordova (or PhoneGap) shell directly. The developers should be familiar with the:
- Plugins that are supported out of the box as well as the AEM Mobile specific plugins.
To learn in-depth about plugins, see the following resources:
Guidelines for AEM Developers
The following guidelines will help experienced AEM developers for sites, who want to build mobile app templates and components:
Structure AEM sites templates to encourage reuse and extensibility
Optimize for on-device performance
- Article specific script and stylesheets should be included in the article payload, using the dps-article contentsync template
- Script and stylesheets shared by more than one article should be included in shared resources, via the dps-HTMLResources contentsync template
- Do not reference any external scripts that are render-blocking
You can learn more in detail about render-blocking external scripts here.
Prefer app-specific clientside JS and CSS libraries over web-specific
- To avoid overhead in libraries like jQuery Mobile to handle a huge breadth of devices and browsers
To learn more in-depth about jQuery mobile, click here.
Prefer micro libraries over full-stack
- The time it takes to get your content onto the glass of the device will be slowed down by every library your article(s) depend upon. This slowdown is compounded when a new webview is used to render every article, so each library must be initialized again from scratch
- If your articles are not built as SPAs (single page apps), you probably do not need to include a full stack library like Angular
- Prefer smaller, single purpose libraries to help add the interactivity your page requires, such as Fastclick or Velocity.js
Minimize size of article payload
- Use the smallest assets possible that can effectively cover the largest viewport you will be supporting, at a reasonable resolution
- Use a tool like ImageOptim on your images to remove any excess metadata
To understand more on the other two roles and responsibilities, see the resources below: