In Magnolia CMS, how can each component declare its required javascript files?

Question

I am using Magnolia CMS 5.3.4, the STK, and freemarker (FTL) template scripts.

Some components I have defined relies on specific javascript files. Right now, what I do is that I include these javascript files in the main.ftl template script. I am looking for a way to get them included only if the specific component is present on the page.

I tried to use the jsFiles property in Template Definitions, but it seems it works only for page template definition.

Answer 1

The jsFiles property indeed works only for pages not for components. This is because Magnolia wants to include those files in header already, rather than loading them in middle of the body when component gets rendered.
As a general practice I would anyway recommend combining your js files into one (look at for example plugin loader in resources on how this is done) and set longer time for caching such file so that browser downloads all the script just once for the whole site rather then page by page. The bigger js file you are sending over the more overhead you are cutting off from requesting separate files and better the compression of content for transport will work.

HTH,
Jan