Caching AEM Pages with Dynamic Content

PublishedApril 28, 2024

In general, when a page is retrieved from cache, all users view identical content. However, websites with gated or authenticated pages, certain sections — such as displaying a logged-in user's name or a login button for anonymous users — must remain dynamic and not be cached. Considering this scenario, Sling Dynamic Include (SDI) in AEM supports the dynamic generation of specific components, while also enabling the retrieval of others from cache.

As AEM transitions to the cloud, the immutable nature of the Publish instance prompts bundle installation through code deployment. To install Sling Dynamic Include, make the following updates to the pom.xml files.

pom.xml

<dependency>
  <groupId>org.apache.sling</groupId>
  <artifactId>org.apache.sling.dynamic-include</artifactId>
  <version>3.3.0</version>
</dependency>

all / pom.xml

<embedded>
  <groupId>org.apache.sling</groupId>
  <artifactId>org.apache.sling.dynamic-include</artifactId>
  <type>jar</type>
  <target>/apps/aem-demo-packages/application/install</target>
</embedded>

<dependency>
  <groupId>org.apache.sling</groupId>
  <artifactId>org.apache.sling.dynamic-include</artifactId>
</dependency>

Upon deploying your code with the mentioned modifications, you can verify the installation through System Console. Subsequently, proceed to configure the SDI OSGi Configuration with the components you want to load dynamically.

config.publish / org.apache.sling.dynamicinclude.Configuration~aem-demo.cfg.json

{
  "include-filter.config.enabled": true,
  "include-filter.config.appendSuffix": true,
  "include-filter.config.add_comment": true,
  "include-filter.config.disableIgnoreUrlParams": false,
  "include-filter.config.extension": "html",
  "include-filter.config.ignoreUrlParams": [""],
  "include-filter.config.include-type": "SSI",
  "include-filter.config.resource-types": [
    "aem-demo/components/usernavigation",
    "aem-demo/components/megamenu"
  ],
  "include-filter.config.rewrite": false,
  "include-filter.config.path": "/content/experience-fragments/aem-demo",
  "include-filter.config.selector": "nocache",
  "include-filter.config.required_header": "Server-Agent=Communique-Dispatcher",
  "include-filter.config.ttl": ""
}

If you inspect the cached file from the dispatcher or inspect the HTML, you'll find something similar as shown below.

HTML View of Sling Dynamic Include Implementation

If you closely review the HTML above, you'll notice a comment that provides details about the content path and component resource type. Additionally, there's an include tag with a virtual attribute, using the content path as its value.

The next step is to ensure the dispatcher retrieves actual content from the publisher which requires configuring the Includes module in the vhost file and disabling caching for requests containing *nocache.html*. This involves adding the Includes option to the Options directive and AddOutputFilter INCLUDES .html in your virtual configuration host.

conf.d / available_vhosts / aemdemo.com.vhost

<Directory "${PUBLISH_DOCROOT}">
  Options Indexes FollowSymLinks Includes
  AddOutputFilter INCLUDES .html
  AllowOverride None
  Require all granted
</Directory>

Additionally, disable the caching for .nocache.html files in the cache rules to ensure responses always come through the publisher and provide the latest content.

conf.dispatcher.d / cache / client_publish_cache.any

/disable-nocache
{
  /glob "*.nocache.html*"
  /type "deny"
}

With the above setup, usernavigation and megamenu component within AEM-Demo Experience Fragments will be dynamically loaded, while other sections of the page will be served from the cache. After successfully implementing the Sling Dynamic Include, you can expect a significant improvement in performance.