Cloudflare เปิดตัว vinext ที่ใช้ AI รีอิมพลีเมนต์ Next.js บน Vite ใหม่ภายใน 1 สัปดาห์

วิศวกรของ Cloudflare คนหนึ่งเปิดเผยโปรเจกต์ 'vinext(vee-next)' ที่เขียนโครงสร้างพื้นฐานอันซับซ้อนของ Next.js ขึ้นใหม่ทั้งหมดบนพื้นฐานของ Vite โดยอาศัยความช่วยเหลือจาก AI (Claude) เป็นความพยายามเชิงทดลองเพื่อแก้ปัญหาการดีพลอยและการบิลด์เรื้อรังของ Next.js

สรุปประเด็นสำคัญ

• แรงจูงใจ: แม้ Next.js จะยอดเยี่ยม แต่เพราะพึ่งพา Turbopack ซึ่งเป็นเครื่องมือบิลด์ของตัวเองอย่างมาก จึงเกิด "คอขวดด้านการดีพลอย" ที่ต้องผ่านอะแดปเตอร์ซับซ้อนอย่าง OpenNext เมื่อต้องการดีพลอยไปยังสภาพแวดล้อม serverless เช่น Cloudflare Workers หรือ AWS Lambda
• กระบวนการพัฒนา: ใช้ AI อย่างจริงจังจนพัฒนาเสร็จภายใน 1 สัปดาห์ ตรวจสอบด้วยการพอร์ตชุดทดสอบจาก Next.js และชุด compatibility tests ของ OpenNext รวมเป็น Vitest กว่า 1,700 รายการ / Playwright E2E 380 รายการ และผ่านการทดสอบ API surface ของ Next.js 16 ได้ 94%
• วิธีแก้: แทนที่จะไปแก้ผลลัพธ์ที่ Next.js สร้างขึ้น ก็เลือกอิมพลีเมนต์ API ของ Next.js (เช่น Routing, RSC, SSR เป็นต้น) ขึ้นใหม่บน Vite ตั้งแต่ต้น
• ผลลัพธ์: ใช้ค่าโทเค็น AI ราว $1,100 และทำเสร็จภายในหนึ่งสัปดาห์ โดยเมื่อเทียบกับ Next.js แล้วมีความเร็วในการบิลด์สูงสุดมากกว่า 4 เท่า และขนาดไคลเอนต์บันเดิลเล็กลง 57%
• จุดเด่นทางเทคนิค: รีอิมพลีเมนต์ API หลักอย่าง next/link, next/navigation, Server Actions, RSC(React Server Components) ในรูปแบบ Vite plugin ทำให้สามารถย้ายแอป Next.js เดิมมาได้แทบจะตรง ๆ

ความสำคัญ: นี่เป็นการพิสูจน์ว่าแม้แต่เฟรมเวิร์กขนาดใหญ่ก็สามารถถูกแทนที่ด้วยเวอร์ชันที่ "เบาและเร็วกว่า" ได้ในเวลาอันสั้น หากมีชุดทดสอบที่นิยามไว้อย่างดีและมี AI ช่วยเหลือ

[myodan]

รู้สึกว่าเพราะ Next.js เป็นโอเพนซอร์ส และมีโครงสร้างกับเป้าหมายที่ค่อนข้างชัดเจน เลยทำให้เกิดความพยายามแบบนี้ขึ้นได้
โดยเฉพาะเมื่อมีทั้งชุดทดสอบและข้อมูลอ้างอิงที่อุดมสมบูรณ์ แนวทางที่ใช้การทำให้ผ่านการทดสอบเป็นตัวชี้นำการพัฒนาก็ดูเป็นสิ่งที่ทำได้จริงมากพอสมควร

ความเร็วในการพัฒนาของ AI น่าทึ่งจริง ๆ
งานยังคงเสี่ยงอยู่เหมือนเดิมเลยนะ.. หรือควรเปลี่ยนสายไปทำงานภาคสนามดี.. ฮือๆ

[xguru]

วิธีรีอิมพลีเมนต์ Next.js ใหม่ด้วย AI ภายในหนึ่งสัปดาห์
โปรดดูเวอร์ชันที่ GN+ สรุปไว้ด้วย

[click]

แม้ในบทความบล็อกจะไม่ได้ใช้โทนแบบนั้น แต่ก็ให้ความรู้สึกว่าการจงใจตัดฟีเจอร์การสร้างเว็บไซต์แบบสแตติกออกไปมีนัยว่า ถ้าจะทำเว็บไซต์แบบสแตติกก็ให้ใช้ Astro

[roxie]

Astro*

[t7vonn]

รู้สึกว่าน่าเสียดายนิดหน่อย ถ้าเอาความพยายามตลอด 1 สัปดาห์นั้นไปช่วยลงแรงกับ opennext คงจะดีกว่า

[click]

แต่เดิมทิศทางที่มุ่งไปก็ต่างกันอยู่แล้ว
OpenNext คือการแปลงผลลัพธ์การบิลด์ของ Next.js ส่วน vinext คือการเขียนใหม่ทั้งระบบโดยแทนที่ turbopack ด้วย Vite

[GN⁺]

ความคิดเห็นจาก Hacker News

• ฉันชอบทั้ง Next และรัก Vite เหมือนกัน แต่รู้สึกว่าทีม Next ไปโฟกัสฟีเจอร์หวือหวาสำหรับผู้ใช้แค่ 0.1% แล้วเมินอีก 99.9% การ fork ครั้งนี้ของ Cloudflare ดูเหมือนจะช่วยคลายความคาใจนั้นได้ เรื่องประสิทธิภาพเป็นสิ่งที่คอมมูนิตี้ Next อยากได้มานาน และตอนนี้ก็เหมือนในที่สุดมีคนฟัง ถ้ามันสำเร็จ ที่บริษัทฉันก็อยากลองใช้มาก

  • Next เป็นเฟรมเวิร์กที่แย่ที่สุดอันดับถัดจาก Rails เท่าที่ฉันเคยใช้มา สำหรับแอปส่วนใหญ่มันเป็นแค่ overhead ล้วน ๆ
  • คิดจริง ๆ เหรอว่าจะหวัง การซัพพอร์ต ระยะยาวจากงานทดลองที่วิศวกรคนหนึ่งทำในเวลาว่างได้?
  • บริษัทเรามี แอป Next.js ที่อายุกว่า 7 ปี ซึ่งก็ยังทำงานดีอยู่ แต่มีการเปลี่ยนแปลงที่ไม่จำเป็นเยอะมาก ทุกครั้งที่อัปเกรดเวอร์ชันก็เสียเวลาไปกับ การรีแฟกเตอร์แบบสูญเปล่า มาก
  • คุณบอกว่าชอบ Next แต่ข้อดีของ Next ที่แยกจาก Vercel คืออะไร? ถ้าไม่มีฟีเจอร์ของ Vercel ผมคิดว่าไม่มีเหตุผลอะไรให้ใช้ Next เลย
  • ฉันเกลียด Next และรัก Vite แอป Next.js production ขนาดใหญ่ ของบริษัทช้ามากจนต้องอัปเกรดเป็น M4 Pro การ build ในเครื่องใช้เวลาหลายนาที และ hot refresh ก็เกิน 10 วินาทีเสมอ ทีม Next เอาแต่ส่งลิงก์เอกสารมาแล้วบอกว่าผู้ใช้ทำผิด แต่จริง ๆ แล้วเฟรมเวิร์กมันช้าเอง

• ผมคิดว่านี่เป็นตัวอย่างที่ดีของ แรงจูงใจในโอเพนซอร์สยุค AI ยิ่งทำเอกสารดีเท่าไร ยิ่งนิยามสัญญาการทำงานไว้ชัดเท่าไร คนอื่นก็ยิ่งคัดลอกได้ง่าย ถ้า Cloudflare ไม่ได้อาศัยชุดทดสอบของ Next การ fork แบบนี้คงเป็นไปไม่ได้ Server Components ยังเป็นแพตเทิร์นที่คนประเมินค่าต่ำเกินไปอยู่ และความพยายามที่จะทำให้ DX เรียบง่ายขึ้นก็เป็นเรื่องน่ายินดี Next ซับซ้อนขึ้นเพราะการขยายแบบค่อยเป็นค่อยไป แต่เฟรมเวิร์กใหม่สามารถออกแบบให้ยืดหยุ่นได้ตั้งแต่แรก

  • ฉันก็คิดเหมือนกัน ถ้ามีคนวางรากฐานการทดลอง API และ best practices เอาไว้แล้ว คนอื่นก็หยิบไปใช้ต่อได้เลย จะบอกว่า Vercel ทำตัวเองก็ได้ แต่ก็อดกังวลไม่ได้ว่าโปรเจ็กต์เล็ก ๆ จะ สูญหาย ไปด้วยวิธีนี้
  • ผมไม่เห็นด้วยกับคำกล่าวที่ว่า Cloudflare คงทำไม่ได้ถ้าไม่มีชุดทดสอบของ Next ระบบที่ซับซ้อนกว่านี้ก็ยังเคยถูกทำซ้ำผ่าน reverse engineering มาแล้ว พอมองจากความเร็วของ AI ผมว่ากำแพงในการเข้าแทบไม่มีแล้ว
  • ถ้ากลายเป็นโมเดล open-core + ชุดทดสอบปิด ของที่เป็นโอเพนซอร์สจริง ๆ ในท้ายที่สุดอาจกลายเป็น ชุดทดสอบหรือสเปก ก็ได้

• ของที่ยังรัน “Hello world” ไม่ได้ แต่บอกว่ารีอิมพลีเมนต์แบบ 'from scratch' ถือว่าเวอร์ไปหน่อย ถ้าเอาชุดทดสอบของต้นฉบับมาใช้ตรง ๆ ก็ยากจะเรียกว่าเขียนใหม่ทั้งหมด มันเหมือนเอาย่อหน้าแรกของนิยายดังมาเปลี่ยนคำไม่กี่คำแล้วอ้างว่าเขียนขึ้นใหม่

• น่าสนใจที่ Cloudflare เพิ่งซื้อ Astro ไปเมื่อเดือนก่อน แล้วตอนนี้ก็มาทำซ้ำ Next.js ด้วย AI ถ้ามันทำได้ง่ายขนาดนั้น แล้วทำไมถึงซื้อ Astro? ก็น่าจะเป็นเพราะต้องการครอบครอง วิสัยทัศน์และภาวะผู้นำ ของเฟรมเวิร์กมากกว่า

  • การซื้อ Astro เป็นกลยุทธ์ผลิตภัณฑ์แบบจริงจัง แต่โปรเจ็กต์นี้ดูเหมือน การทดลองเพื่อแซะคู่แข่ง มากกว่า คงต้องรอดูผลในอีกไม่กี่ปี
  • Astro เน้น เว็บไซต์แบบสแตติก เลยเป็นคนละพื้นที่กับ Next Cloudflare ดูเหมือนอยากใช้ Astro เพื่อยึดชั้นหนึ่งของเว็บแบบที่ Vercel ทำ สุดท้ายคนที่ย้ายเว็บไซต์ Next.js ไป Cloudflare ก็น่าจะถูกผลักไป migrate ไป Astro
  • Astro เหมาะกับเว็บสแตติก ส่วน Next ใช้กับ เว็บแอปแบบไดนามิก ได้ด้วย เราใช้ Astro กับระบบเอกสารภายในและพอใจมาก
  • น่าจะเป็นแค่กลยุทธ์ในการ ดึงคนเข้าสู่ ecosystem ของตัวเอง ช่วงนี้ฉันย้ายไปใช้ Svelte แล้ว และก็สนุกกับมันมาก
  • Astro ไม่ได้แก้ปัญหาเดียวกับ Next มันเอาไว้สำหรับ เว็บไซต์แบบสแตติก

• ก่อนหน้านี้ Next.js เคยมี ช่องโหว่ remote code execution มาก่อน ดังนั้นเวอร์ชันที่ AI สร้างขึ้นฉันคงยังเลี่ยงไปก่อนสักพัก

  • ผมก็ห่วงเรื่องนั้นที่สุดเหมือนกัน ผมไม่ใช้ Next.js กับโปรเจ็กต์ส่วนตัวมาตั้งแต่ก่อน RCE แล้ว และ การสร้างโค้ดด้วย AI ยิ่งทำให้บั๊กแบบนี้เกิดง่ายและหลุดรอดได้ง่ายขึ้น
  • นั่นไม่ใช่ช่องโหว่ของ Next แต่เป็น ช่องโหว่ของ React

• พอมีคนบอกว่า “AI รีอิมพลีเมนต์ X ได้แล้ว” ฉันจะ สงสัย ไว้ก่อนเสมอ เพราะรายละเอียดพวก edge case และการแก้บั๊กที่สะสมมาหลายปีมักจะหายไป ถ้าผ่านทุกการทดสอบก็ค่อยยอมรับ แต่ถ้าไม่ก็เชื่อยาก

  • ฉันก็ไม่ได้เชื่อเต็มร้อย แต่รอบนี้เขาบอกว่าผ่าน unit test 2,000 รายการและ E2E test 400 รายการ ของ Next

• โปรเจ็กต์นี้เป็น การทดลอง AI ที่น่าสนใจที่สุด เท่าที่ผมเคยเห็นมา ผมตกใจที่มันเล็กกว่าตัวโค้ดเบสของ Next.js มาก แต่ก็ยังสงสัยว่ามันแค่ผ่านชุดทดสอบหรือเปล่า เช่นการทำ form ก็ต่างออกไปมาก ถึงอย่างนั้นก็ยังน่าประทับใจ

  • (วิศวกร Cloudflare) เป้าหมายไม่ใช่ ความเทียบเท่าด้านฟังก์ชันแบบสมบูรณ์ ตอนนี้ยังเป็นเวอร์ชันเริ่มต้นและยังมีหลายส่วนที่ขาดอยู่ เหตุผลที่โค้ดเล็กเป็นเพราะมันสร้างอยู่บน Vite และปลั๊กอิน RSC
  • นี่ดูแทบจะเป็น การโจมตีแบบเชิงรับ เลย Cloudflare มีปัญหากับทีม Next หรือเปล่า? อารมณ์เหมือน “เราใช้ AI กับอินเทิร์นก็ทำผลิตภัณฑ์คุณได้หมดแล้ว”
  • น่าจะเพราะ โยนลอจิกจำนวนมากให้ Vite จัดการ เลยทำให้โค้ดลดลง

• ผมไม่เห็นด้วยกับคำพูดที่ว่า “abstraction ในซอฟต์แวร์เกิดขึ้นเพราะมนุษย์รับมือกับความซับซ้อนไม่ไหว” abstraction มีไว้เพื่อ จับแก่นของความเป็นจริง และเพิ่ม การนำกลับมาใช้ซ้ำ ส่วนการแบ่งเป็นชั้น ๆ ก็เป็นแค่เรื่องของการแยกความรับผิดชอบ

• น่าสนใจที่ต้นทุนทั้งหมดอยู่ที่ โทเคนราว 1,100 ดอลลาร์

• แก่นจริง ๆ อยู่ที่ จังหวะเวลาของการซื้อ Astro Cloudflare ซื้อ Astro ไปเมื่อเดือนก่อน และครั้งนี้ก็ประกาศทำซ้ำ API ของ Next.js ด้วย AI นี่คือสัญญาณของการ รื้อ lock-in ของเฟรมเวิร์ก เท่ากับมอบทางหนีให้ผู้ใช้ Next.js ที่ติดกับ Vercel อยู่สองทาง — โปรเจ็กต์ใหม่ไป Astro, โปรเจ็กต์เดิมใช้ Vinext ต่อให้ตอนนี้ยังไม่พร้อมใช้ production มันก็เป็นสารที่สั่นคลอน ความสามารถในการแข่งขันด้านราคา ของ Vercel ได้

  • เลยนึกถึงว่า ชุดทดสอบของ SQLite เป็นแบบปิด
  • ต่อให้ Next.js จะโดนด่ามากแค่ไหน ก็คงไม่มีใครย้าย production ไปหา โปรเจ็กต์อายุหนึ่งสัปดาห์ หรอก แต่สุดท้ายมันก็อาจมาแทน Turbopack ของ Vercel ได้สักวัน
  • Cloudflare รองรับ OpenNext อยู่แล้ว