📊 Giải thích Output Build của Next.js với next-intl

📊 Giải thích Output Build của Next.js với next-intl

1️⃣ Tổng quan về Output Build

Đây là báo cáo từ lệnh next build trong Next.js (App Router). Nó liệt kê các route của ứng dụng, dung lượng của từng trang và JavaScript tải lần đầu (First Load JS).

• ○ → Trang được prerendered (tĩnh).

• ƒ → Trang được server-rendered (động).

• Middleware → Middleware được sử dụng để xử lý request trước khi đến trang đích.

2️⃣ Phân tích từng phần

📌 Mục Route (app)

Hiển thị danh sách các route và dung lượng của từng trang:

👉 Nhận xét:

• Các route có prefix /[locale] → Do next-intl sử dụng đa ngôn ngữ (en, vi, v.v.), mỗi trang sẽ có phiên bản khác nhau dựa vào locale.

• Route /robots.txt và /sitemap.xml có kích thước 0 B → Chứng tỏ chúng chỉ là các file tĩnh.

📌 First Load JS shared by all

Hiển thị danh sách các chunk JavaScript được chia sẻ giữa tất cả các trang:

👉 Nhận xét:

• Tổng cộng 88.7 kB JavaScript được tải trên tất cả các trang.

• Nếu số này quá lớn, có thể tối ưu bằng Code Splitting hoặc Lazy Loading.

📌 Middleware

👉 Nhận xét:

• Middleware có thể đang được sử dụng để tự động chuyển hướng / → /[locale] (ví dụ: /en, /vi).

• Dung lượng 39.7 kB là hợp lý nhưng có thể tối ưu nếu cần.

🔥 Kết luận

✅ Ứng dụng Next.js của bạn đang hoạt động với next-intl, sử dụng App Router và Middleware để hỗ trợ đa ngôn ngữ.
✅ First Load JS ~ 88.7 kB → Tương đối tốt, nhưng có thể tối ưu thêm bằng Lazy Loading.
✅ Các route động (ƒ) như /[locale]/[category]/[id] khá lớn (321 kB) → Cần kiểm tra xem có thể tối ưu không.

📌 Bạn có muốn tối ưu phần nào không? 🚀