App Router khác Pages Router trong Next.js như thế nào?

Sự khác biệt chính bao gồm:

• Kiến trúc (Architecture): App Router (Next.js 13+) dùng thư mục app/ và hỗ trợ React Server Components mặc định. Pages Router dùng thư mục pages/ nơi mọi component được xử lý như Client Component.
• Data Fetching: App Router fetch trực tiếp trong Server Components (async/await). Pages Router dùng getStaticProps hoặc getServerSideProps.
• Layouts: App Router có nested layouts (layout.tsx) giữ state khi chuyển trang. Pages Router layout phức tạp hơn (_app.tsx).

App Router là kiến trúc hiện đại và được khuyên dùng cho các dự án Next.js mới.