Paypal-checkout-components: Why PayPal Express checkout.min.js loading twice ?

Created on 31 Jul 2019  路  6Comments  路  Source: paypal/paypal-checkout-components

Description

Every time when our page loads with PayPal express checkout smart buttons, the required checkout.js minified is downloaded twice: once on page load and once more when the button render function gets triggered. Is that expected behavior ?

  • Screenshots or videos that show the issue
    image

  • The paypal.version from your browser console - "4.0.282"

  • The exact browser version - All the browser versions
  • A link to your page with the issue, if possible - https://www.bose.com/
  • Does the issue also occur at developer.paypal.com/demo/checkout ? - Yes
  • Does the issue occur consistently, or intermittently? - Consistently

Steps to reproduce

Go to the given page, add some product to the cart. It will direct you to cart page where you can find the issue.

Affected browsers

  • [ +] Chrome
  • [ +] Safari
  • [ +] Firefox
  • [ +] Edge
  • [ +] IE
  • [ +] Chrome Mobile/Tablet
  • [x] Safari Mobile/Tablet
  • [x] Web View / Safari ViewController
  • [ ] Other
outdated

Most helpful comment

I also experience this with setting up paypal/braintree. I'm following the standard client setup guide - https://developers.braintreepayments.com/guides/paypal/client-side/javascript/v3#basic-configuration.

When calling await paypal.Button.render(..) (https://www.sandbox.paypal.com/smart/button?env=sandbox&) it seems to download the whole checkout.min.js even though it has already been loaded first on my page and paypal is available in window.

Causes an additional 192kb script load. See example:
Screen Shot 2019-11-14 at 12 51 21 PM

All 6 comments

@bluepnume Could you please clarify regarding the posted question. Our production team is concerned about this issue as a performance degradation in the live site.

Okay, I am also facing a similar issue, not sure if it has the same root cause.
Using this component causes bundle size to increase(1.4 MB+), also IDK why it downloads the file from CDN too(2 times for the same job?). This seems very strange.

I also experience this with setting up paypal/braintree. I'm following the standard client setup guide - https://developers.braintreepayments.com/guides/paypal/client-side/javascript/v3#basic-configuration.

When calling await paypal.Button.render(..) (https://www.sandbox.paypal.com/smart/button?env=sandbox&) it seems to download the whole checkout.min.js even though it has already been loaded first on my page and paypal is available in window.

Causes an additional 192kb script load. See example:
Screen Shot 2019-11-14 at 12 51 21 PM

This is expected. The script is loading from cache inside the button iframe. It should only be downloaded a single time, and cached.

Yeah I realised i was importing the script via require js from src hence both of them getting called.

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

Was this page helpful?
0 / 5 - 0 ratings