Minifying js and css files in aem cloud

[bethen5]

When doing a site audit, a requirement from it was that we minify our JavaScript and CSS files.  We are on AEM cloud, what is the recommended way to accomplish this.  

[arunpatidar]

Hi @bethen5 
Please check 

https://experienceleague.adobe.com/en/docs/experience-manager-cloud-service/content/implementing/dev... 

https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/process-of-minifying-js-an...

https://experienceleague.adobe.com/en/docs/experience-manager-65/content/implementing/developing/int... 

[h_kataria · Accepted solution]

"Adobe Granite HTML Library Manager" is the OSGI config where you can enable a system wide minification for your clientlibs.
AEM ships with two inbuilt preprocessor for minification i.e YUI (https://github.com/yui/yuicompressor#yui-compressor---the-yahoo-javascript-and-css-compressor )and GCC (https://developers.google.com/closure/compiler/) 
You can further enable /disable this processing at the clientlib level by setting some properties on the clientlib using respective processor's available options. Sample below :

cssProcessor: ["default:none", "min:yui"]
jsProcessor: ["default:none", "min:gcc;compilationLevel=advanced"]

cssProcessor: ["default:none", "min:none"]
jsProcessor: ["default:none", "min:none"]

Both options are fine and implementation will depend on your requirements. Just take extra caution for minification of clientlibs which are based on some FE framework like react etc. because if you are using webpacks then they you probably don't have to minify them again, as it might break some functionality. Similarly we faced issues with SVGs as well in an old project during minification (not sure if that is fixed now), minification breaks those by removing spaces if they are not already properly encoded.
Hope this helps.