Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
BedrockMission!

Learn More

View all

Sign in to view all badges

AEM Versioned clientlibs can be a lifesaver in terms of performance push | AEM Community Blog Seeding

Avatar

Avatar
Establish
Community Manager
kautuk_sahni
Community Manager

Likes

1,127 likes

Total Posts

6,116 posts

Correct Reply

1,144 solutions
Top badges earned
Establish
Coach
Originator
Contributor 2
Contributor
View profile

Avatar
Establish
Community Manager
kautuk_sahni
Community Manager

Likes

1,127 likes

Total Posts

6,116 posts

Correct Reply

1,144 solutions
Top badges earned
Establish
Coach
Originator
Contributor 2
Contributor
View profile
kautuk_sahni
Community Manager

02-02-2021

BlogImage.jpg

AEM Versioned clientlibs can be a lifesaver in terms of performance push by Divanshu Goyal

Abstract

Whenever we talk about AEM clientlibs comes to a handy tool to deploy all the js and CSS bundled together as a single loaded entity over the page at load event.

For a long time, we always have a common concern to cache the clientlibs on the page to increase the performance. But we always got stuck in an infinite loop when we talk about continuously updating clientlibs and cache becomes overhead for invalidation each time.

So, versioned clientlibs solve this problem for us as it allows to cache CSS and JS to be cached for a longer period of time at the same time as invalidation happens automatically too which in turn reduces the page load time of the website and improves performance as It uses Sling Rewriter to rewrite the client libraries generated by aem and append a unique MD5 value at the end of the client library URL and later it is cached. This MD5 value is unique to the code of ClientLibs. If there is a modification in code or ClientLibs, a new MD5 value will be generated and appended to the client library URL this allows it to recache.

How to implement versioned clientlibs in AEM?
1. Login to http://localhost:4502/crx/de/index.jsp.
2. Navigate to /apps//config and create an nt:unstructured folder by naming it as rewriter.
3. Navigate to /libs/cq/config/rewriter/default, copy the default node and paste it under your project config folder,
4. Select default node and add versioned-clientlibs to transformer types.
5. Along with the rewriter configuration, you’ll also need to configure Apache to send the right headers.

If somehow developers revert to an older version of ClientLibs. Since the MD5 value is unique for the codebase, and reverted version of the codebase will have its own MD5 value client library which will be already cached due to longer TTL, and AEM need not generate the ClientLibs again until TTL expires.

Read Full Blog

AEM Versioned clientlibs can be a lifesaver in terms of performance push

Q&A

Please use this thread to ask the related questions.

AEM AEMEBlogSeeding Experience Manager