[RFC] Inline assets

[grachevko]

What about option to inline assets (CSS or JS) into twig?

[weaverryan]

Yep, that’s interesting :). Can you tell me more about how you would use the feature? Online everything? Or choose if you want to inline on an entry-by-entry basis? Or by filesize?

[grachevko]

I guess all of this. Somewhere need to inline everything, somewhere only js for page block but without vendor js.
By filesize, in my opinion, require delayed injection to prevent injection file in middle of page, If js will be greater than limit where this file are included, to include it in the bottom with others.

[PabloKowalczyk]

IMO inlining CSS can be very useful with "Critical CSS" technique - https://www.smashingmagazine.com/2015/08/understanding-critical-css/.

[seyfer]

Something like that required. We use inline assets with the custom extension now

<style type="text/css">{{ inline_asset(asset('css/some.css', 'widget'))|raw }}</style>
<script>{{ inline_asset(asset('js/some.js', 'widget'))|raw }}</script>

this still works with Webpack 4 encore if option .disableSingleRuntimeChunk() used.

[weaverryan]

Btw, you could also iterator over the CSS or JS files via encore_entry_js_files() or encore_entry_css_files and then do your inline_asset() trick.

This feature is interesting - but I haven't researched it at all yet. I often look at what "native Webpack" does - an then try to stay as close to that as possible.

[carsonbot]

Thank you for this issue.
There has not been a lot of activity here for a while. Has this been resolved?

[PabloKowalczyk]

@weaverryan are you open for PR with inline Twig helper?