symfony / webpack-encore-bundle

Symfony integration with Webpack Encore!
https://symfony.com/webpack-encore
MIT License
940 stars 83 forks source link

Unable to preload links: feature not supported #210

Open BigBenJr opened 1 year ago

BigBenJr commented 1 year ago

Hi. I activated in config/packages/webpack_encore.yaml the preload of script & link tags via HTTP/2 Link header preload: true

But I see this log error at each new request unable to preload links: feature not supported

My base.html.twig used simple Encore entry tags

        {% block stylesheets %}
            {{ encore_entry_link_tags('app') }}
        {% endblock %}
        {% block javascripts %}
            {{ encore_entry_script_tags('app') }}
        {% endblock %}

Any idea on what should I do to activate this feature ? Thanks !

symfony/webpack-encore-bundle v.1.16.1

BigBenJr commented 1 year ago

Still can't find a solution to preload script & link tags. Here is what I may see in console:


The resource https://127.0.0.1:8001/build/app.js was preloaded using link preload but not used within a few seconds from the window's load event. Please make sure it has an appropriate `as` value and it is preloaded intentionally.
The resource https://127.0.0.1:8001/build/vendors-node_modules_hotwired_turbo_dist_turbo_es2017-esm_js-node_modules_symfony_stimulus-br-912310.js was preloaded using link preload but not used within a few seconds from the window's load event. Please make sure it has an appropriate `as` value and it is preloaded intentionally.
The resource https://127.0.0.1:8001/build/app.css was preloaded using link preload but not used within a few seconds from the window's load event. Please make sure it has an appropriate `as` value and it is preloaded intentionally.
The resource https://127.0.0.1:8001/build/runtime.js was preloaded using link preload but not used within a few seconds from the window's load event. Please make sure it has an appropriate `as` value and it is preloaded intentionally.
weaverryan commented 1 year ago

Hi!

unable to preload links: feature not supported

I'm not sure about this - was it an error from your browser? From Symfony?

The resource https://127.0.0.1:8001/build/app.js was preloaded using link preload but not used within a few seconds from the window's load event

That looks a bit odd. However, I will admit that the preload: true option is a bit of a "all or none" type of option. It tells your browser to preload EVERYTHING. If there are some files that are actually required lazily later only when they're needed, then what can happen is that we tell the browser to preload the file, the browser does... then it sees that we never even needed it within the first few seconds, and it triggers this warning to let you know. It basically means "Hey, maybe you shouldn't have forced me to download this file early... since it's clearly not actually needed at first".

What's odd is that app.js, just to choose the most obvious example, is definitely used/needed on page load I would think - there should be an actual <script src="/build/app.js"> right in your page source.

BigBenJr commented 1 year ago

Thanks for your reply @weaverryan

The error unable to preload links: feature not supported comes from Symfony web server log file. [Web Server ] Jul 18 17:21:04 |ERROR | SERVER unable to preload links: feature not supported

Here is an extract of the HEAD tag of all my website pages:

<head>
<link rel="stylesheet" href="/build/app.css" data-turbo-track="reload">
<script src="/build/runtime.js" defer="" data-turbo-track="reload"></script>
<script src="/build/vendors-node_modules_hotwired_turbo_dist_turbo_es2017-esm_js-node_modules_symfony_stimulus-br-912310.js" defer="" data-turbo-track="reload"></script>
<script src="/build/app.js" defer="" data-turbo-track="reload"></script>
</head>

My webpack_encore.yaml file

webpack_encore:
    output_path: '%kernel.project_dir%/public/build'

    script_attributes:
        defer: true
        'data-turbo-track': reload

    link_attributes:
         'data-turbo-track': reload

    preload: true

framework:
    assets:
        json_manifest_path: '%kernel.project_dir%/public/build/manifest.json'

If I comment defer: true to deactivate it, defer attributes disappear but I still have the same error related to preload in Symfony log and web console.

weaverryan commented 1 year ago

unable to preload links: feature not supported comes from Symfony web server log file

Hmm, I have no idea where that's coming from - it seems like it may be from the symfony-cli web server itself.

was preloaded using link preload but not used within a few seconds

This is also a mystery... as we can see those script tags right on the page.

Sorry, I'm a bit stumped also :/