Symfony Twig: Why use asset method?

11,298

Solution 1

Your main directory is \web

in your config.yml (config/packages/framework.yaml using Symfony 5 and later):

assets:
    packages:
        downloads:
            base_path: images/yesterday/answers/download/
        attachment:
            base_path: stack/post/answers/ 

in this case downloads and attachment are your 'sections'

instead to write this code:

<img src="images/yesterday/answers/download/facebook.png" />
<img src="stack/post/answers/photo.jpeg" />

You can use:

<img src="{{ asset(facebook.png, 'downloads') }}" />
<img src="{{ asset(photo.jpeg, 'attachment') }}" />

because you don't have long path in the view and also you organize more your project classify for sections

more info here: http://symfony.com/doc/current/reference/configuration/framework.html#assets

Solution 2

Because the Twig tag asset tag runs PHP code behind the scenes, it can alter the output. For example, I have a system running where the original files in the web/assets/js/ directory (and img/ or css/) are renamed based on the content - this means that when they are being served by a webserver, they can be marked as 'cache this file forever', and so hopefully a website reader will not have to download the same file again, because they have the first time the file was sent.

The asset tag in this instance is given the original filename, but that is just used as a lookup in an index to a uniquely renamed file - one that will never need to change, and so can be marked as cachable for potentially years.

Share:
11,298
Eric
Author by

Eric

Updated on June 21, 2022

Comments

  • Eric
    Eric almost 2 years

    Symfony recommends putting assets in the web folder.

    They also comment about using the asset method. Why is the asset method needed? It takes up more characters than just putting in the link.

    Why is this:

    <img src="{{ asset('img/social/facebook.png') }}" />
    

    better than this:

    <img src="/img/social/facebook.png" />
    

    I feel like I must be missing some reasons why.

    • JimL
      JimL almost 7 years
      I suggest you read this blog post. Using asset supports path shortcuts to avoid what you're describing, but the strongest argument for it (imho) is that you are very easily able to move your assets to a different storage, ie a cdn.
    • Jared Farrish
      Jared Farrish almost 7 years
      What you're demonstrating is useless. What is more useful is if you had a configured filesystem for /img/social so that you could do asset('facebook.png', 'assets') and later on redefined the assets filesystem to point to a CDN and you don't have to search/replace and whatnot. :)
    • Eric
      Eric almost 7 years
      Thanks @JaredFarrish. I knew I was missing something.
    • Jared Farrish
      Jared Farrish almost 7 years
      It's one of those tools where you don't know what it's for until you need it. Even if you use the "full" path like in the question, using asset() would still be convenient for those situations like I described, because it would fix the URL for you (even though it "looks" like it's just more typing). That said, unless you've got asset mania, just use the paths to your local directories. When you need asset(), you'll get it. Refactor then and update your paths.
  • Jared Farrish
    Jared Farrish almost 7 years
    We have a similar configuration, only it picks the associated Flysystem filesystem path based on the key.