I'm using assetic on Symfony 2 and I press all my CSS and JS files thanks to YUI. ALL works perfectly, but on prod environment, I have multiple calls to load every pressed files. In fact, I thought that assetic could bine all CSS files (and JS files) to have just a single call to a unique file (one for CSS, another one for JS), and that for each page, is it possible ?

I don't find documentation about it ... Have an idea ? Thanks !

I'm using assetic on Symfony 2 and I press all my CSS and JS files thanks to YUI. ALL works perfectly, but on prod environment, I have multiple calls to load every pressed files. In fact, I thought that assetic could bine all CSS files (and JS files) to have just a single call to a unique file (one for CSS, another one for JS), and that for each page, is it possible ?

I don't find documentation about it ... Have an idea ? Thanks !

• javascript
• css
• symfony
• assetic

2 Answers 2

Like describe in the documentation, you can also bine several files into one. This helps to reduce the number of HTTP requests, which is great for front end performance.

You just have to use this syntax :

{% javascripts
    '@AcmeFooBundle/Resources/public/js/*'
    '@AcmeBarBundle/Resources/public/js/form.js'
    '@AcmeBarBundle/Resources/public/js/calendar.js'
%}
<script src="{{ asset_url }}"></script>
{% endjavascripts %}

For bining css files into one in dev environment

php app/console cache:clear --env=dev --no-debug

To see the bined file served when the page is requested

// app_dev.php
$kernel = new AppKernel('dev', false); 
// Setting the second parameter to false turns of debugging

Ensure you are bining assets

{% javascripts
    '@AcmeFooBundle/Resources/public/js/*'
    '@AcmeBarBundle/Resources/public/js/form.js'
    '@AcmeBarBundle/Resources/public/js/calendar.js'
%}
<script src="{{ asset_url }}"></script>
{% endjavascripts %}

Same follows for production environment