Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

bundle-common.js and page specific bundle-*.js is loaded 2 times on the page load #177

Open
salmanazeez786 opened this issue Mar 8, 2023 · 5 comments
Open

bundle-common.js and page specific bundle-*.js is loaded 2 times on the page load #177

salmanazeez786 opened this issue Mar 8, 2023 · 5 comments

Comments

@salmanazeez786
Copy link

salmanazeez786 commented Mar 8, 2023 •
edited
Loading

I see that the bundle-* files are loading twice on the Homepage, PLP and PDP pages for which I have created the magepack bundles
image

Further looking in the code , I see the layout xmls are adding the bundle-common.js & page specfic bundle-*.js in the head section,

cms_page_view.xml
<body>
        <referenceBlock name="magepack.bundles">
            <arguments>
                <argument name="page_bundles" xsi:type="array">
                    <item name="cms" xsi:type="array">
                        <item name="config_path" xsi:type="string">magepack/requirejs-config-cms.js</item>
                        <item name="bundle_path" xsi:type="string">magepack/bundle-cms.js</item>
                    </item>
                </argument>
            </arguments>
        </referenceBlock>
    </body>

But the same bundle-common.js and page specfic bundle-*.js is also added as a prefetch link in phtml templated which loads in all pages

MageSuite_Magepack::bundles-loader.phtml

<?php if ($commonBundleUrl): ?>
<link rel="prefetch" as="script" href="<?= $commonBundleUrl; ?>"/>
<?php endif; ?>

<?php foreach($pageBundlesUrls as $pageBundleUrl): ?>
<link rel="prefetch" as="script" href="<?= $pageBundleUrl; ?>"/>
<?php endforeach; ?>

Is this expected ? or can we remove the prefetched ones ?
@salmanazeez786 salmanazeez786 changed the title bundle-common and page specific bundle-*.m bundle-common.js and page specific bundle-*.js is loaded 2 times on the page load Mar 8, 2023
@fredden
Copy link
Contributor

fredden commented Mar 8, 2023 •
edited
Loading

The "prefetched ones" are intentional, and desired. More details about what these mean can be seen here:

In your screen-shot, I can see that you have enabled the "disable cache" feature, which instructs the browser to disregard all its internal caches where possible. That's why you have duplicate fetches of the same asset(s). I recommend you untick that box and then review the "size" column, which should show that one of the "duplicates" is a fetch (probably from disk, but possibly from the network), and the other is loaded from the prefetch cache.

Screenshot_2023-03-08_15-54-31

@salmanazeez786
Copy link
Author

@fredden I disabled cache to check the hits on server. And I see 2 hits on the server. For any new user who accesses the site, it adds 1 additional request on server along the original one, but the successive calls are prefetched cached and we are good on that.
The issue is with reports showing these additional requests and are adding up load times to the web vitals. On GTmetrix we see decrease in percent of performance comparing before and after changes.

image

Il go through the documents you have shared, but also want to know if there will be any issue if we ignore the prefetch scripts on the phtml? I didnt see any though, but would like to hear from you

@fredden
Copy link
Contributor

fredden commented Mar 8, 2023 •
edited
Loading

That's curious; I'm only seeing a single request for each asset in the web server logs that I reviewed just now. Are the cache-related headers that the browser receives sensible? Is there a public URL that you can share of a website you're having trouble with?

Yes, you can remove the <link rel="prefetch" /> HTML elements without impacting the functionality of the website. This is likely to have a negative impact on the performance of the website. I recommend against optimising for a particular tool/score, and instead optimise for human experience. Keeping the browser hint will give best results for humans.

@salmanazeez786
Copy link
Author

salmanazeez786 commented Mar 8, 2023 •
edited
Loading

@fredden I don't have a public URL to share for now, but I checked on the access logs and I can confirm we do see 2 requests for the first hit on server. For now I have added the below patch to enable/disable Prefetch

Config-to-disable-prefetch.patch

@onlinebizsoft
Copy link

@fredden @salmanazeez786 I guess the author have tested with devtools opening and enable Disable cache option so the prefetch and the include will be 2 load times. This is not an issue.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
3 participants
@fredden @salmanazeez786 @onlinebizsoft