Investigate sluggish local dev performance

[travisbloom-cb]

Local dev performance has gotten dramatically slower, I dont think it used to be this bad. Something changed (maybe thirdweb upgrade?).

We should checkout older branches to try and pinpoint the time this issue propped up and see if we can mitigate with better next.js configs

[travisbloom-cb]

Timeboxed to 2 days

[travisbloom-cb]

Might be solved by #1293

[twistershark]

When I try to use turbo on dev, I usually see this error when I try to save a file.

Error: Module [project]/node_modules/next/dist/esm/client/components/error-boundary.js [app-ssr] (ecmascript) was instantiated because it was required from module [project]/node_modules/next/dist/esm/build/templates/app-page.js?page=/[locale]/events/page { COMPONENT_0 => "[project]/src/app/layout.tsx [app-rsc] (ecmascript, Next.js server component)", COMPONENT_1 => "[project]/src/app/not-found.tsx [app-rsc] (ecmascript, Next.js server component)", COMPONENT_2 => "[project]/src/app/[locale]/layout.tsx [app-rsc] (ecmascript, Next.js server component) <facade>", COMPONENT_3 => "[project]/src/app/[locale]/error.tsx [app-rsc] (ecmascript, Next.js server component)", COMPONENT_4 => "[project]/src/app/[locale]/not-found.tsx [app-rsc] (ecmascript, Next.js server component)", COMPONENT_5 => "[project]/src/app/[locale]/events/page.tsx [app-rsc] (ecmascript, Next.js server component)" } [app-rsc] (ecmascript) <locals>, but the module factory is not available. It might have been deleted in an HMR update.

[twistershark]

I tried updating code in a route that doesn't have localization and it worked perfectly. I updated code in /embedded/map and hot reload worked 100%

@travisbloom-cb @mhamendes @lucasrmp-cb

[twistershark]

TODOs:

[ ] - Upgrade to V15 canary(with React 19) ignoring conflicts to verify that the error is fixed on V15 | IN PROGRESS
[ ] - If it is, create an upgrade plan to React 19 first and then an upgrade plan to Next V15
[ ] - If it doesn't fix, try to find a solution online around it and patch the necessary modules for it to work
(use https://www.npmjs.com/package/patch-package)

Possible related issue: vercel/next.js#64494
Possible related fix: vercel/turborepo#7959 -> Try to patch the corresponding node_module with this PR content

Removed this suggestion as @olavoparno has done this upgrade attempt, but it didn't solve the problem

[twistershark]

Tried new attempts while investigating this problem:

• Replaced the homepage with a new version containing only a div with some headings, also removed all layout.tsx code, middleware, sentry and so on. The objective here was to restore each piece one by one to try to find which code or lib could be causing this issue. Result: Didn't make any difference. When I tried to change the headings text to check how long the fast refresh would take, it usually took 8/10 seconds to process without any other lib or code loaded.

• Tried running the project in another computer, but the results were the same

---

Next action

• Continue investigating NextJS issues on Github to check if something that could give us a hint about something that could be causing this issue.

[twistershark]

After further investigation, I saw that creating issues on the NextJS repo about performance problems usually has replies. Vercel members help investigate the problem using the generated trace file inside .next.

Something that I saw that is very common is Vercel members asking the issue owner to update next to the latest version to make sure that the problem that they are facing is not fixed in the next version.

Because of that, I think that a clear next step before creating an issue would be to upgrade our project libs versions to make sure that we will have the latest version of everything. This will also benefit us when we upgrade to React 19 and NextJS 15.

---

As we are close to the election, we decided to postpone this upgrade work until after the election to prevent facing new bugs from the libs upgrade during this important time for our team.

C.C.: @travisbloom-cb