shopify-webhook | How to handle Shopify web hooks in Lambda | REST library

I mostly work on front-end so I'm not super familiar with NodeJS. I'm working on a Shopify Custom App and purpose of this app is when order placed it will receive webhook request and with that request it will send some data to other API (billing application)

I built shopify app with shopify app cli and my server.js file is like this;

I followed this tutorial: https://shopify.dev/tutorials/build-a-shopify-app-with-node-and-react

From the beginning, my app was extremely slow to load, including when changing tabs, including when loaded through ngrok and run on localhost or deployed on app engine.

What could be causing this ?

P.S.: I am new to React, Next.js and Shopify App development, so the answer could be quite basic.

P.P.S.: The build output seems to indicate "First Load JS shared by all" is too large based on the red color. I do not know how to investigate this and reduce the size of said chunks although a mere 214KB could not explain such slow load times, could it ?

Build

React Dev Tools Profiler

@next/bundle-analyzer Output:

Parsed

Gzipped

package.json

I am making a shopify app and have created a Koa + NodeJS backend and NextJS running in frontend, in the same port, and also I have created a custom server.js file When running locally in my PC, its running all right, all the routes work as expected, and I am able to fetch data from Frontend (React) from the routes defined in my backend (Koa).

Now the problem is that, when I deploy my app to vercel it doesn't seem to be recognizing my Koa routes, and is throwing a 404 error in the console for all the requests I make to the backend routes. This is my first time working with NextJS, so I have really very little idea on what is wrong here, so I would like some support on this please.

Also when I deploy it, the shopify auth also doesn't seem to be working anymore like it does when its running in local development.

My Code: server.js: