Next.js Discord

Discord Forum

Almost 2s for the page to load

Unanswered
Whiteleg shrimp posted this in #help-forum
Open in Discord
Whiteleg shrimpOP
Hi, using open telemetry I found that "resolve page components" in taking almost 2 seconds to be complete. I have no idea what this is or how to optimize it. I'm using NextJS and Vercel, any ideas?

23 Replies

Whiteleg shrimpOP
it's a hono api
@Whiteleg shrimp it's a hono api
Dutch
np show
Whiteleg shrimpOP
Ok, but it is big
import * as Effect from "effect/Effect"
import { Hono } from "hono"

import { MainDatabase } from "@repo/databases/unio/service"
import { sql } from "@repo/databases/utils/drizzle"

import { authRouter } from "../routers/auth.js"
import { tenantRouter } from "../routers/tenant.js"
import { tenantesRouter } from "../routers/tenantes.js"
import { filesRouter } from "../routers/files.js"
import { invoicesRouter } from "../routers/invoices.js"
import { profileRouter } from "../routers/profile.js"
import { pusherRouter } from "../routers/pusher.js"
import { LiveRuntime } from "../runtimes/live-runtime.js"

export const app = new Hono()
  .basePath("/api")
  .route("/auth", authRouter)
  .route("/profile", profileRouter)
  .route("/tenants", tenantsRouter)
  .route("/pusher", pusherRouter)
  .route("/tenant", tenantRouter)
  .route("/invoices", invoicesRouter)
  .route("/files", filesRouter)
  .get("/ping", async (c) => {
    const details = await LiveRuntime.runPromise(
      Effect.gen(function* () {
        const db = yield* MainDatabase
        return yield* db.execute((db) => db.execute(sql`SELECT NOW()`)).pipe(Effect.map((result) => result.rows[0]))
      })
    )
    return c.json({ message: "pong", result: details })
  })
  .notFound((c) => c.json({ message: "Not found" }, 404))
  .onError((err, c) => {
    console.error(err)
    return c.json({ message: "Internal server error" }, 500)
  })

export type App = typeof app
import { server } from "@repo/hono/server"

export const maxDuration = 60

export const GET = server
export const POST = server
export const PUT = server
export const DELETE = server
import { handle } from "hono/vercel"

import { app } from "./app.js"

export const server = handle(app)
This is the auth router
Dutch
then yeah its okay that 2s for this
that 2s is okay for this
Whiteleg shrimpOP
because the size?
or deps?
Dutch
both
even a route is calling some other functions, also every auth takes some time to load
Whiteleg shrimpOP
and is there something that I can do about it?
any optimization trick?
is this dev mode or prod mode? for dev mode, 2s is very normal
in fact 2s is on the much faster side
interesting, no idea sorry... i don't know what "resolve page components" here means either
Whiteleg shrimpOP
😦
Dutch
Can you share a live URL of your app to check network tab