This repository contains a comparison of project sizes between Next.js projects structured using the pages directory approach and the app directory approach.
This repository aims to compare the resulting project sizes when adopting either of these approaches. It explores the impact on bundle size and build performance, helping developers make informed decisions about the project structure they choose.
The bundle size was analyzed using Next.js + Webpack Bundle Analyzer.
This is the result from from the pages
branch.
This is the result from the app
branch.
The client bundle using app dir is 200kb bigger than pages dir.
Run yarn install
to install all dependencies for a project.
To analyze bundle size run yarn analyze-bundle
(in the branches app
or pages
)