Optimize AEM Site Performance

This article focuses on ways that you can improve the performance of your site. We highlighted the various aspects of Adobe Experience Manager (AEM) applications and architectures that have caused the most performance issues. By implementing the optimizations listed here, you can avoid those common issues.

Description description


Adobe Experience Manager


How to optimize AEM site performance?

Resolution resolution

Site Performance

  1. Perform regular maintenance.
  2. Make back-end service calls fault tolerant - see this article for details.
  3. Be careful when using third-party UI frameworks - We have seen various customers using or building libraries that build a whole layer on top of the AEM / Sling web framework. We are not referring to utilities that target specific functionality in the UI (for example ACS Commons) but frameworks that fundamentally change how you implement your application on AEM. While these frameworks may slightly reduce development time, many times we have seen that they can introduce a negative impact on performance.
    Third-party frameworks aren’t supported or tested by Adobe. When using or implementing such frameworks, make sure to thoroughly load and stress test your application with realistic traffic.

Client-side performance

  • Use and optimize AEM client libraries - client libraries are an easy way to centralize the management and optimization of CSS and JavaScript code in your site.

    • Embed client libraries to consolidate them into fewer files.
    • Minify the libraries.
  • Put CSS includes in HTML head tag – this helps avoid flickering and repainting of the page after load.

  • Put JavaScript script includes in end of body tag or add the async script attribute - this allows the browser to load JavaScript files in parallel while the page is being rendered.

  • Implement Domain Sharding - By default, web browsers limit the maximum number of parallel requests per domain during page load. This can cause delays in loading the page if you have many resources such as CSS, JavaScript, etc. that must load before your page is rendered. Domain sharding is a solution that helps work around this problem. Domain sharding is where you include files such as CSS and JavaScript on your site via multiple subdomains.

    • For example:

      code language-none
      script src="//includes1.yoursite.com/etc/clientlibs/test.js"/script
      script src="//includes2.yoursite.com/etc/clientlibs/test2.js"/script
    • Use ACS Commons - Static Reference Rewriter to implement domain sharding.

  • Cache JavaScript and CSS for long periods of time - To allow caching javascript and css for long periods of time, use ACS Commons - Versioned Clientlibs.

  • See the Google PageSpeed rules documentation for more pointers on how to optimize your site.

  • See this AEM Gems session for further information on-site optimizations.

Author Instance Editing Performance

  1. Perform regular maintenance.
  2. Reduce the total components on the page - When there are hundreds individual editable components loaded on an AEM page in an author instance, this greatly affects the performance of the editor UI. When designing your application, favor components that are more specific to the site and easy for editors to use versus generic components that have a lot of sub-components.
  3. Avoid nesting many levels of container components (paragraph system, responsive grid, experience fragments) - Avoid nesting many levels of container components. Nesting paragraph systems or responsive grids causes the /editor.html page to load slower. This is especially the case where the paragraph system or responsive grid includes a long list of content. Instead of nesting paragraph systems, design the application to reference content from other pages. If you opt for using experience fragments, then avoid nesting them as well, or use building blocks. Nested experience fragments are affected by the same performance limitations.

Cache Optimization

In a common AEM site architecture, the HTTP request passes through multiple caches before it finally reaches the AEM publish instances. One of the easiest ways to improve site performance is to optimize your site’s cacheability.

See this article for detailed steps on how to optimize caching in your site.

Optimize Indexes for Custom JCR Queries

Another optimization that can be done which improves performance is to configure and optimize Oak Indexes for your custom JCR queries. If you are using JCR queries within your application, this is generally a mandatory task.

See the official documentation (1 and 2) for how to implement Oak indexes for your custom application queries.:

QueryBuilder guessTotal

If you are using the AEM QueryBuilder and expect the query to return a lot of results, then always make sure to set the guessTotal property on the root PredicateGroup as it reduces reduce memory usage. See the official documentation on this for details: Query Builder API