- ยังคงชอบ React และชอบสิ่งที่ Vercel มอบให้ แต่กำลัง ย้ายไปใช้ TanStack เพราะปัญหาเรื่อง ความซับซ้อนที่เพิ่มขึ้นและต้นทุน ของ Next.js
- TanStack ยังไม่สมบูรณ์นัก แต่ เข้าใจได้ง่าย และ สามารถเพิ่มฟีเจอร์ขั้นสูงได้ง่ายเมื่อจำเป็น
- จนกว่าจะจำเป็นต้องใช้ฟีเจอร์ขั้นสูงของ Next.js, TanStack คือทางเลือกที่ดีที่สุด
จุดแข็งของ Next.js
- ตั้งค่าได้รวดเร็วและรองรับการผสานรวมที่หลากหลาย
- Next.js คือ "React Framework for the Web" ที่ช่วยตั้งค่าแอป React ได้อย่างรวดเร็ว
- มีคู่มือการผสานรวมหลากหลาย เช่น MUI, MarkdocDataDog
- มีเนทีฟปลั๊กอินสำหรับเครื่องมืออย่าง Jest
- เหมาะกับแอปพลิเคชันขนาดใหญ่ที่ต้องการประสิทธิภาพสูง
- ปรับแต่งรูปแบบการเรนเดอร์ของแต่ละหน้าได้อย่างละเอียด
- มี API หลากหลายสำหรับประสิทธิภาพระดับสูง
- การเรนเดอร์ฝั่งเซิร์ฟเวอร์ (SSR)
- การพรีเรนเดอร์บางส่วน (PPR)
- Edge Functions, streaming และ selective hydration
- รองรับ Incremental Static Regeneration (ISR) จึงจัดการคอนเทนต์ทราฟฟิกสูงได้อย่างมีประสิทธิภาพ
ข้อจำกัดและปัญหาของ Next.js
- ความซับซ้อนของฟีเจอร์ขั้นสูงที่ไม่จำเป็น
- ฟีเจอร์ขั้นสูงหลายอย่างให้ความรู้สึกเกินความจำเป็นสำหรับแอปขนาดเล็ก
- มีฟีเจอร์ปรับปรุงประสิทธิภาพระดับย่อยจำนวนมากที่สตาร์ตอัประยะเริ่มต้นยังไม่จำเป็นต้องใช้
- ปัญหาเรื่องต้นทุนทางการเงิน
- ฟีเจอร์จำนวนมากของ Next.js ผูกอยู่กับบริการเชิงพาณิชย์
- Edge computing (
middleware.ts)
- การแปลงรูปภาพ (
next/image)
- ISR (
export const revalidate = 60)
- การรัน serverless function (
app/api/route.ts)
- การพึ่งพาบริการของ Vercel สูงทำให้มีความเสี่ยงด้านต้นทุนที่เพิ่มขึ้น
- เส้นโค้งการเรียนรู้และพื้นผิว API ที่ซับซ้อน*
- ความซับซ้อนของ App Router ทำให้เส้นโค้งการเรียนรู้สูง
- การอธิบายแนวคิดในเอกสารค่อนข้างเข้าใจยาก
- ดีบักได้ยาก
- มีระบบแคชถึง 3 แบบ ได้แก่ full route cache, data cache และ router cache
- รองรับ SPA (Single Page Application) ได้ไม่ดีพอ
- การรองรับ SPA ของ Next.js มีข้อจำกัดและปรับปรุงประสิทธิภาพได้ยาก
- ประสิทธิภาพของ development server ด้อยกว่าเมื่อเทียบกับ Vite
- ประสิทธิภาพของ TurboPack ก็ยังไม่เป็นไปตามที่คาดหวัง
ข้อดีของ TanStack + Vite
- โครงสร้างเรียบง่ายและตรงไปตรงมา
- TanStack Router รองรับ auto-complete และการตรวจสอบ search parameter ผ่าน Zod
- การไหลของโค้ดชัดเจนและคาดเดาได้
- การจัดการสถานะด้วย TanStack Query
- จัดการ server state และดีบักได้ง่าย
- มี developer tools ในตัว
- ประสิทธิภาพที่รวดเร็วของ Vite
- การ build และการรันโค้ดทำได้รวดเร็ว
- ใช้งานได้ทันทีโดยไม่ต้องตั้งค่าซับซ้อน
- ไม่ผูกติดกับบริการคลาวด์รายใดรายหนึ่ง
1 ความคิดเห็น
ผมคิดว่าถ้าทำไปเรื่อย ๆ สุดท้ายก็จะออกมาเป็นแบบ next.js