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

How to speed up Drop-in script #735

Open
wasshuber opened this issue May 14, 2021 · 2 comments
Open

How to speed up Drop-in script #735

wasshuber opened this issue May 14, 2021 · 2 comments
Labels
v2

Comments

@wasshuber
Copy link

wasshuber commented May 14, 2021 •
edited
Loading

General information

  • SDK/Library version: 1.28.0/js/dropin.min.js
  • Environment: Production

Issue description

Processing of dropin.min.js takes about 2 seconds. Is there anyway to speed this up? I am calling the script at the very top after <head> like this:
<script src="https://js.braintreegateway.com/web/dropin/1.28.0/js/dropin.min.js"></script>

Here is an example javascript code how I am using the drop-in. Anything I am doing wrong? Any suggestions to make it faster?

var subm_button = document.querySelector("#submit-button");
braintree.dropin.create({
  authorization: <KEY>,
  container: "#dropin-container",
  locale: "en_US",
  dataCollector: {},
  card: {
	overrides: {
      fields: {
        postalCode: {
          prefill: "02143"
        }
      }
    }
  },
  //vaultManager allows customers to delete their past used and stored credit cards
  vaultManager: true,
  paypal: {
	flow: "checkout",
	amount: "4.50",
	currency: "USD",
	//flow: "vault",
	buttonStyle: {
      color: "gold",
      shape: "rect",
      size: "responsive",
	  label: "paypal",
	  tagline: "false"
    }}
  //venmo: {}
}, function (createErr, instance) {
  subm_button.addEventListener("click", function (event) {
    //need to find value of radio button via querySelector otherwise it does not work on IE
    var radio_value = document.forms["checkout_payment"].querySelector('[name="payment"]:checked').value;
    if (radio_value == "braintree_payments") {
		event.preventDefault();
		instance.requestPaymentMethod(function (err, payload) {
			document.getElementById("BTdevicedata").value = payload.deviceData;
			document.getElementById("BTnonce").value = payload.nonce;
			document.forms["checkout_payment"].submit();
		});
	}
  });
});
@crookedneighbor
Copy link
Contributor

There's nothing you can do right now, but rendering speed is one of our chief concerns for the next major version of Drop-in. I'll leave this issue open and mark it with the v2 label.

@wasshuber
Copy link
Author

That is great to hear that rendering speed is an area you are focusing on for future releases. I am looking forward to it. If you need a site to test it on I am more than happy to do that on my life production website.

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

No branches or pull requests
2 participants
@crookedneighbor @wasshuber