How to reduce delays when calling external api

[peterpot20]

const queryExternalAPI = async (headers, query, variables = {}, reqQuery = {}) => {
  let jwt = headers.authorization?.split(' ')[1];

  if (!jwt) {
    // delete reqQuery.path_prefix;
    const payload = {
      extensionParameters: reqQuery,
    }

    jwt = jwt.sign(payload, secret, { expiresIn: '30s' })
  }

  const graphQLClient = new GraphQLClient(endpoint, {});
  graphQLClient.setHeader('authorization', `Bearer ` + jwt);
  graphQLClient.setHeader('x-api-key', process.env.api_key || '');
  let result = [];
  if (variables.length > 0) {
    result = await graphQLClient.request(query);
  } else {
    result = await graphQLClient.request(query, variables);
  }
  return result;
}

Hi, I am developing a embedded app and theme app extension. Both components need to call external APIs. At the moment I utilize async and await to make the flow more straightforward, but it is very slow. For example, when a customer visits a product page, a button should be available to click that opens a dialog modal to prompt their input. The condition to make the button available depends on the response of calling an external API. I need to wait for 3 seconds for the button to correctly analyze the return value from the external API and become available to the users.

As an example, here is a function I use in index.js:

How do I reduce this delay? Will it help if I change it to using promise instead?

Thanks!