Combine Javascript/CSS files

Combine Javascript/CSS files

  

Hello All,


Is there any way to combine Javascript/css files by the platform, whether native support or any alternatives?


Thanks,

Haitham Mohammed

Hi Haitham,

In what way would you like to combine js/css files? Please give some more info.

Regards,

Jasper

Hi Jasper,

I'd like to combine generated platform js/css files into one file each to minimize the web requests needed to render the web page so it is loaded faster, especially when using silk UI templates and patterns css/js.


Thanks,

Haitham Mohammed

Hi,


For Responsive applications the platform already does css concatenation by default to reduce the amounts of requests for css files.

Check this topic for more information. Note that the topic was written for 9.1, so disregard all that enabling stuff if you are on a later version. The thread also has a huge discussion about why not js concatenation and metrics over the improvements it would bring.

In summary, with all the browser cache taken into factor, even the improvements of css concatenation are almost insignificant. In fact since blocks present in the page can affect your css it can even be worse since each page will have a different css file and will not take advantage of the browser cache.


For the new Mobile applications in version 10 this is also different. The application makes sure that all files are cached and updated at the start (during the spash screen), so in there having different files is actually better since on updates it will only fetch the modified ones and all cache is local after that (so 0 latency).


Regards,
João Rosado

Oops, correcting myself from the previous reply.

The concatenation feature present in the topic I linked is still an Opt-In feature, so the enable procedures still apply. Like I said, the performance gains/losses are very questionable. This forum has it enabled.


Regards,
João Rosado

@Haitham:

The way the platform generates these files is very dynamic, so one stylesheet for the complete app wouldn't fit that gap. I think the advantage here is the way they split up all the templates in different layers, like screen/module/application specific styles. This way you keep these files to only a few kb's. The more global theme-like css files are already browsercached so these are preloaded already is future requests.
Btw. With your solution also the maintainability and overview of your files will decrease, unless your pointing towards compression-like feature to combine them at build time (runtime minification/combination is a resource pig).  :)

@João Nice to know that the Opt-In feature is there and already to be used.

Regards,

Jasper