Abhishek•11mo ago

Why my Convex simple query is taking too long?

Here is the next js log the GET req takes around 2233ms. Currently in dev mode Is there a problem with my implementation or am I doing something wrong? here is the component :

export default async function LinkedInConnectButton() {
  const token = await getAuthToken();
  const userAccessTokenExist = await fetchQuery(
    api.users.getUserToken,
    {},
    { token }
  );

  async function linkedInAction() {
    "use server";
    const redirectUrl = process.env.LINKEDIN_REDIRECT_URL;
    const oauthApi = `link`;
    redirect(oauthApi, RedirectType.push);
  }
  async function unlinkAction() {
    "use server";
    await fetchMutation(api.users.deleteUserToken, {}, { token });
    revalidatePath("/dashboard/settings");
  }

  return (
    <div className="flex justify-between items-center w-full py-3 px-6 rounded-sm border-t border-sky-500/20 bg-sky-500/20">
      <div className="flex items-center justify-center gap-2 text-sm">
        <Image src="/linkedin-icon.svg" alt="twitter" height={28} width={28} />
        <span className="text-md">LinkedIn</span>
      </div>
      {!userAccessTokenExist ? (
        <form action={linkedInAction}>
          <button className="group hover:bg-sky-500/80 rounded-md shadow-md bg-sky-500 text-white px-2 py-1.5 text-sm flex justify-between items-center gap-1 duration-150">
            <PlusCircleIcon
              height={20}
              widths={20}
              strokeWidth={1.5}
              color="white"
              fill="rgb(56 189 248 )"
              fillOpacity={50}
            />
            <span className="">Add Account</span>
          </button>
        </form>
      ) : (
        <form action={unlinkAction}>
          <UnLinkedbutton />
        </form>
      )}
    </div>
  );
}

export default async function LinkedInConnectButton() {
  const token = await getAuthToken();
  const userAccessTokenExist = await fetchQuery(
    api.users.getUserToken,
    {},
    { token }
  );

  async function linkedInAction() {
    "use server";
    const redirectUrl = process.env.LINKEDIN_REDIRECT_URL;
    const oauthApi = `link`;
    redirect(oauthApi, RedirectType.push);
  }
  async function unlinkAction() {
    "use server";
    await fetchMutation(api.users.deleteUserToken, {}, { token });
    revalidatePath("/dashboard/settings");
  }

  return (
    <div className="flex justify-between items-center w-full py-3 px-6 rounded-sm border-t border-sky-500/20 bg-sky-500/20">
      <div className="flex items-center justify-center gap-2 text-sm">
        <Image src="/linkedin-icon.svg" alt="twitter" height={28} width={28} />
        <span className="text-md">LinkedIn</span>
      </div>
      {!userAccessTokenExist ? (
        <form action={linkedInAction}>
          <button className="group hover:bg-sky-500/80 rounded-md shadow-md bg-sky-500 text-white px-2 py-1.5 text-sm flex justify-between items-center gap-1 duration-150">
            <PlusCircleIcon
              height={20}
              widths={20}
              strokeWidth={1.5}
              color="white"
              fill="rgb(56 189 248 )"
              fillOpacity={50}
            />
            <span className="">Add Account</span>
          </button>
        </form>
      ) : (
        <form action={unlinkAction}>
          <UnLinkedbutton />
        </form>
      )}
    </div>
  );
}

20 Replies

AbhishekOP•11mo ago

For more clarity here is file link - https://github.com/imaxisXD/AIvy-Post/blob/main/components/social-media-linkers/linkedin-connect-btn.tsx

GitHub

AIvy-Post/components/social-media-linkers/linkedin-connect-btn.tsx ...

Contribute to imaxisXD/AIvy-Post development by creating an account on GitHub.

AbhishekOP•11mo ago

https://github.com/imaxisXD/AIvy-Post/blob/main/convex/users.ts#L99

GitHub

AIvy-Post/convex/users.ts at main · imaxisXD/AIvy-Post

Contribute to imaxisXD/AIvy-Post development by creating an account on GitHub.

sshader•11mo ago

Some ideas for debugging -- I'd add some logging to narrow down whether the slowness is coming from the fetchQuery or somewhere else (alternatively you could look at the Logs page in the Convex dashboard which should show the execution time for the query). Something like console.time("getUserToken") right before and console.timeEnd("getUserToken") right after the fetchQuery call. If it is the query that's slow, I'd also add some console.time calls in the query itself to see what parts might be slow.

AbhishekOP•11mo ago

Interesting I tried this

AbhishekOP•11mo ago

and the result I got that fetchQuery is taking 1.5 sec

AbhishekOP•11mo ago

But api.users.getUserToken
api.users.getUserToken
is only taking 12ms I am confused why its like that ? I still cant figure this out, anyone can help me with this? Thank you

ballingt•11mo ago

@Abhishek can we see the code for the getUserToken query? It'd be interesting to see UserRecord and getUserToken console.time and console.timeEnd calls This sounds like a lot to be all network. Where is this code running? Is this in development (in which case, where are you located?) or production (Vercel, yeah? in which case whihc region does this code run in?)

AbhishekOP•11mo ago

https://github.com/imaxisXD/AIvy-Post/blob/main/convex/users.ts#L99 Here

GitHub

AIvy-Post/convex/users.ts at main · imaxisXD/AIvy-Post

Contribute to imaxisXD/AIvy-Post development by creating an account on GitHub.

AbhishekOP•11mo ago

Currently Dev, I am located in India. @ballingt

ballingt•11mo ago

Can you try a npx convex network-test?

AbhishekOP•11mo ago

@ballingt it timing out everytime

Network test timed out after 10s.

Network test timed out after 10s.

AbhishekOP•11mo ago

I have noticed that even a simple query is taking too long for the first time req, in both the server component and client component which is making my user experience so sluggish . Is it a location issue or an issue with my ISP i am not able to find the correct solution to this Thank you

ballingt•11mo ago

Could you try this from production?

AbhishekOP•11mo ago

Havent deployed the app to prod yet Is there any other solution, I don't want to refactor the whole codebase back to supabase just cuz of this . I love convex simplicity and ease of use

ballingt•11mo ago

The important thing to your customers will be the performance in production, but I understand it's annoying to see worse performance while developing. There's nothing to recommend right now. In the future: - The Convex backend will be open source before too long. It will be possible to set up local development for situations like this. - We've prototyped edge caching, it's not something we're recommending to everyone yet but that can cut down on this latency. Convex will likely roll this out at some point but there's no timeline for this currently.

AbhishekOP•11mo ago

So for now @ballingt I have to test if it is working fine on prod or not . And if it isn't then there is nothing we can do right?

ballingt•11mo ago

There's nothing you can do but we'd work to improve this if it were an issue in prod; it's easier for us to respond to bad performance in a datacenter because we can't replicate your home network conditions.

Indy•11mo ago

@Abhishek I was in India for a month developing last year. There were often really quite strange network blips. Often because of hyper local conditions or regional network conditions. We have some longer term ideas that can make this a bit better from our end but nothing super concrete yet. Some folks have had luck using VPNs. Sometimes switching from the home network to a tethered network also helped me

AbhishekOP•11mo ago

That makes sense, I will make the app to production and post on this thread. Hopefully, everything goes well 🤞🏻 Thanks @Indy I will try both VPN and switching to a tethered network approach. By the way, how was your trip to India? I hope you had a fantastic time there. If you ever plan to visit Bangalore, India in the future, please don't hesitate to let me know. I'd be more than happy to host you and show you around the city.

Indy•11mo ago

It was great! I was visiting family in the north. My parents lived in Bangalore for a few years a while ago so I am somewhat familiar with the city. Thanks for the invite. I'll let you know if I am around.

Why my Convex simple query is taking too long?

Did you find this page helpful?