CQ5 Remove Render-Blocking JavaScript

adobe, aem, css, java, javascript

Solution

The cq:includeClientLib does not have any options to do this. You can try using the com.day.cq.widget.HtmlLibraryManager interface to get the path of JS file, the tag is a is a convenience wrapper of this interface.

com.day.cq.widget.HtmlLibraryManager clientlibmanager = sling.getService(com.day.cq.widget.HtmlLibraryManager.class);
if(clientlibmanager != null)
{ 
    String[] categoryArray = {"headlibs"};
    java.util.Collection<com.day.cq.widget.ClientLibrary> libs = clientlibmanager.getLibraries(catArray,com.day.cq.widget.LibraryType.JS,false,false);
    for(com.day.cq.widget.ClientLibrary lib : libs) {
        out.write("<script async type=\"text/javascript\" src=\""+lib.getIncludePath(com.day.cq.widget.LibraryType.JS)+"\"></script>");
    }

} else {
         out.write("clientlib manager is null");
  }

The method `getIncludePath()` also takes an additional parameter minified (boolean) to give path to the minified file.

Problem

I'm working on this document to remove blocking js: Remove Blocking JS However with CQ5 we include js via: ``` <cq:includeClientLib js="headlibs"/> ``` How can I modify script tag like: ``` <script async src="my.js"> ``` So I can remove blocking JS.

Original source