News / เจาะฟีเจอร์ / รวมค่าย
รวมค่าย · เจาะฟีเจอร์

Canvas UI คือไลบรารีคอมโพเนนต์ที่ David Haz เพิ่งเปิดตัวเมื่อวาน…

ภีศเดช เพชรน้อย
ภีศเดช เพชรน้อย
25 ก.ค. 2026 · อ่าน 2 นาที
สรุปสั้น — Canvas UI คือไลบรารีคอมโพเนนต์ที่ David Haz เพิ่งเปิดตัวเมื่อวาน และเป็นไลบรารี html-in-canvas ตัวแรกของโลกเท่าที่เขาเคลม จุดที่ทำ
#Coding#Agent
Canvas UI คือไลบรารีคอมโพเนนต์ที่ David Haz เพิ่งเปิดตัวเมื่อวาน…

จุดที่ทำให้มันต่างจากเอฟเฟกต์เว็บทั่วไปคือมันเอา DOM จริงๆ ของเรามาวาดลงบน canvas แบบ real-time แล้วทับด้วย WebGL shader แต่ข้อความยังเลือกได้ ลิงก์ยังคลิกได้ปกติ ไม่ใช่การแปลงหน้าเว็บเป็นภาพนิ่งหรือ iframe แบบที่เคยทำกันมา

มีคอมโพเนนต์ให้เลือกใช้ 24 ตัวตอนเปิดตัว อย่าง Liquid จำลองของเหลวไหลตามเมาส์ Glass เลนส์แก้วโค้งตามเคอร์เซอร์ Shatter ทำให้หน้าเว็บแตกเป็นชิ้นแก้ว 3D หรือ VHS ให้เอฟเฟกต์เทปเก่าเสียงรบกวน รองรับทั้ง React Vue Svelte และ vanilla TypeScript ใช้ engine เดียวกันหมด

ติดตั้งแบบ shadcn style คือก็อปโค้ดเข้าโปรเจกต์ตรงๆ ไม่ใช่ npm package แก้ไขได้เต็มที่ และรองรับ AI agent ผ่าน MCP บอก AI ว่าอยากได้ particle reveal ตรง hero section มันหาคอมโพเนนต์แล้วติดตั้งให้เลย

เปิดซอร์สฟรีทั้ง personal และ commercial ใช้ได้ตลอด ข้อจำกัดเดียวคือห้ามเอาไปขายต่อเป็นไลบรารีเอง ตอนนี้ต้องเปิด experimental flag ใน Chrome ถึงจะเห็นเอฟเฟกต์เต็มรูปแบบ ถ้าเบราว์เซอร์ไม่รองรับมันจะ fallback เป็น WebGL overlay ธรรมดาแทนไม่พัง กระแสตอบรับตอนนี้ค่อนไปทางตื่นเต้นมาก GitHub star ทะลุพันภายในวันเดียว และเข้าไปอยู่ใน registry ของ shadcn แล้วด้วย

อยากใช้ AI กับงานจริงเป็นระบบ?

เรียน Claude Method — วิธีคิดและลงมือใช้ Claude/AI กับงานจริง ตั้งแต่วันแรก

ดูคอร์ส →

📍 โพสต้นฉบับบน Facebook: AI กับ Peesamac