Expand my Community achievements bar.

SOLVED

Does EDS handle javascript and CSS minification and versioning?

Avatar

Level 4

This is a 2 part question regarding EDS handling of javascript and CSS.

 

Part 1: AEM 6.5 has a feature that minifies javascript and CSS. Does EDS have a similar ability or is this an optimization step that must happen inside the GIT repo?

 

Part 2: Adobe AEM Commons has a "Versioned Clientlibs" feature that adds a new cache-busting string to a file path when a clientlib is updated. Does EDS have a similar ability or is there some other process?

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

Hi @andyshreve ,

 

1) EDS doesn't have this feature out of the box. However, there is an example how you can use SCSS for your project: https://github.com/sachioross/helix-project-boilerplate-sass . Based on this example you can implement minifying.

Note: most likely you will need to keep 2 version of files in repo: {resource}.scss, {resource}.min.css, {resource}.js, {resource}.min.js

2) EDS doesn't have this feature out of the box and it's not needed, because JS/CSS are returned with ETag and Last-Modified header that solves problem with cache as well. I'd not suggest applying long term caching for your JS/CSS with additional headers feature. 

 

Best regards,

Kostiantyn Diachenko.

View solution in original post

2 Replies

Avatar

Correct answer by
Community Advisor

Hi @andyshreve ,

 

1) EDS doesn't have this feature out of the box. However, there is an example how you can use SCSS for your project: https://github.com/sachioross/helix-project-boilerplate-sass . Based on this example you can implement minifying.

Note: most likely you will need to keep 2 version of files in repo: {resource}.scss, {resource}.min.css, {resource}.js, {resource}.min.js

2) EDS doesn't have this feature out of the box and it's not needed, because JS/CSS are returned with ETag and Last-Modified header that solves problem with cache as well. I'd not suggest applying long term caching for your JS/CSS with additional headers feature. 

 

Best regards,

Kostiantyn Diachenko.

Avatar

Level 1

For point 2, why would this not be needed? This is how you invalidate the cache on the browser (e.g. requesting a new object like my-script.v1.js or my-script.v2.js). The browser wont get a new object if its cached so the ETag and Last-Modified do nothing in terms of keeping the cache fresh in this case. There are compliance use cases where the page content must be able to be updated immediately and if there is no way to invalidate the browser cache then we cannot cache at all.

 

It would be really nice if EDS had some sort of versioning built in. Since its buildless, we cannot do it ourselves easily.