// PROJECT NOTE
A Next.js refactor beyond reorganizing folders
What changed in Arvand’s routes, localization, scrolling, carousel rendering and client data—and why using Next.js alone did not guarantee a lightweight frontend.
Read articlesouth
Structure and runtime cost were connected
When I started rebuilding parts of Arvand, the work was not limited to tidying folders. Routes, localization and browser performance all needed attention.
I standardized the structure around the Next.js App Router and separated routes, features, shared components, content and i18n logic. That made the responsibilities clearer, but the runtime work was just as important.
Treat localized URLs and error pages as part of the product
I revised English and Italian language handling so links used locale-aware URLs. I also worked on the 404 experience in both languages, including correct links and avoiding hydration errors.
A translated page is only one part of localization. Navigation and error states need to remain consistent with the selected language too.
Reduce the work sent to the browser
- Removed the expensive smooth-scrolling implementation whose continuous requestAnimationFrame loop was adding CPU pressure.
- Used content-visibility and removed heavy blur effects on smaller screens to reduce rendering work while scrolling.
- Changed the carousel so only its active image rendered, instead of loading and decoding every image together.
- Stopped sending complete article, project and service datasets to Home just to display a few previews.
- Moved unnecessary data out of Client Components and into Server Components, removing a large client-side bundle.
Cleaner code still needs production checks
I checked the changes with linting, a production build, translation and asset checks, and smoke tests for routes and APIs. The result I described in the post was less browser pressure and lighter scrolling and navigation.
My takeaway was that choosing Next.js is only the starting point. Oversized client data, uncontrolled image decoding and expensive effects still affect the experience. Clearer server/client boundaries and more deliberate rendering were the changes that mattered in this project.