Spark - เรนเดอเรอร์ 3D Gaussian Splatting ขั้นสูงสำหรับ Three.js

 (sparkjs.dev)
3 คะแนน โดย GN⁺ 2025-06-13 | 1 ความคิดเห็น | แชร์ทาง WhatsApp
  • Spark คือเรนเดอเรอร์ขั้นสูงที่สร้างมาเพื่อเรนเดอร์ 3D Gaussian Splatting ในฉากของ Three.js
  • สร้างโดย World Labs และสามารถวาง splat ร่วมกับเมชอื่น ๆ ภายในฉากเดิมได้
  • มุ่งเป้าไปที่การ เรนเดอร์ที่รวดเร็ว บนอุปกรณ์ทุกประเภท และเน้นการจัดการคอนเทนต์ splat ในสภาพแวดล้อมที่หลากหลาย
  • รองรับ เอฟเฟกต์ splat แบบไดนามิก ที่ตั้งโปรแกรมได้ ทำให้สามารถสร้างเอฟเฟกต์ภายในฉากได้มากกว่าการแสดงผลแบบคงที่
  • รองรับหลายฟอร์แมต เช่น ply, sogs, spz, splat, ksplat และสามารถเริ่มต้นได้ทันทีจากเอกสารทางการ

เรนเดอเรอร์ splat ที่ผสานเข้ากับฉาก Three.js

  • Spark คือเรนเดอเรอร์ 3D Gaussian Splatting สำหรับ Three.js
  • พัฒนาโดย World Labs
  • สามารถผสานเข้ากับฉาก Three.js ที่มีอยู่เดิมเพื่อใช้งานร่วมกับ เมช และ splat อื่น ๆ ได้

ความสามารถในการเรนเดอร์และฟอร์แมตที่รองรับ

  • ระบุว่าสามารถให้การ เรนเดอร์ที่รวดเร็ว บนอุปกรณ์ทุกประเภท
  • รองรับ เอฟเฟกต์ splat แบบไดนามิก ที่ตั้งโปรแกรมได้
  • ฟอร์แมตที่รองรับมีดังนี้
    • ply
    • sogs
    • spz
    • splat
    • ksplat
  • เอกสารเริ่มต้นใช้งานมีให้ที่ Get started

บทความที่เกี่ยวข้อง

1 ความคิดเห็น

 
GN⁺ 2025-06-13
ความคิดเห็นใน Hacker News

  • เดโมน่าประทับใจมาก และยังรันได้ดีบน iPhone รุ่นเก่าด้วย
    ในฐานะนักพัฒนาเกมงานอดิเรกที่ไม่ได้มีความรู้ด้านการเขียนโปรแกรม 3D มากนัก ถ้ามีคำจำกัดความสั้น ๆ สักบรรทัดใน GitHub หรือที่ไหนสักแห่งบนเว็บไซต์ว่า Gaussian splatting คืออะไร ก็น่าจะดี
    แค่มีคำอธิบายประมาณใน Wikipedia ว่า “Gaussian splatting เป็นเทคนิค volume rendering ที่เรนเดอร์ข้อมูลเชิงปริมาตรโดยตรง โดยไม่แปลงข้อมูลให้เป็น surface หรือ line primitives” ก็จะทำให้รู้สึกคาดหวังกับโปรเจกต์และความเป็นไปได้ในการใช้งานมากขึ้นมาก
    ถ้าสามารถสร้างเมฆ ไฟ ควันประสิทธิภาพสูงได้ ก็คงยอดมาก

    • ควรเพิ่ม FAQ อย่างยิ่ง

  • เดโมสแกนอาหาร โดยเฉพาะส่วนตัวอย่าง “Interactivity” นั้นยอดเยี่ยมมาก
    ชอบฉากที่มองเข้าไปด้านในรูของขนมปังใน Mel's Steak Sandwich เป็นพิเศษ และเมื่อเทียบกับระดับรายละเอียดที่เห็นแล้ว ประสิทธิภาพบนโน้ตบุ๊กกราฟิกออนบอร์ดก็น่าทึ่งมาก
    อยากรู้ว่าตอนนี้เทคนิคนี้ถูกใช้บ่อยที่สุดในด้านไหน

    • มีชุมชนที่กระตือรือร้นในการสแกนวัตถุสั้น ๆ ด้วยอุปกรณ์พกพาหรือโดรน
      Tipatat ได้提供 การสแกนอาหาร สำหรับเดโมไว้ค่อนข้างมาก และผมก็ชอบงานสแกนดอกไม้ของ kotohibi ด้วย: https://superspl.at/user?id=kotohibi
    • เมื่อเทียบกับรายละเอียดระดับนั้น ขนาดส่งผ่านก็ไม่เลวเลย แค่ประมาณ 80MB เท่านั้น
      ไม่ได้ประชดนะ มันดูเรียบร้อยจริง ๆ

  • อันนี้ก็เจ๋ง และ BabylonJS ก็รองรับ Gaussian splatting ได้ดีเช่นกัน: https://doc.babylonjs.com/features/featuresDeepDive/mesh/gau...

    • BabylonJS กับ Aframe [1] ในโพสต์ต้นทางดูเหมือนจะมีไลเซนส์ จำนวนดาวและฟอร์กบน GitHub ใกล้เคียงกัน แต่ Aframe ดูใหม่กว่าและเน้นเกม/VR มากกว่า
      ในฐานะคนที่เคยใช้ Babylon, Aframe, Three.js, PlayCanvas [2] อยากรู้ว่าเทียบกันแล้วเป็นอย่างไร
      เท่าที่เข้าใจ PlayCanvas เป็นตัวที่ mature ที่สุด ฟีเจอร์เยอะที่สุด และประสิทธิภาพก็ดี แต่เป็นเชิงพาณิชย์ ส่วน Babylon เป็นเอนจิน 3D ที่ฟีเจอร์ครบ และ Three.js ค่อนข้างดิบกว่า แม้จะมีองค์ประกอบดี ๆ อย่าง animation, texture ฯลฯ แต่สุดท้ายให้ความรู้สึกว่าต้องสร้างชุดเครื่องมือของตัวเองอยู่ดี
      อยากรู้ว่ามีประสบการณ์ดีหรือแย่กับตัวไหนบ้างไหม
      เดโมเสถียรมากจริง ๆ อยากรู้ว่าเสน่ห์หลักของ Aframe คืออะไร
      และก็อยากรู้ว่าอนาคตของ Gaussian splatting จะเป็นไปอย่างไร จะมีการใช้งานนอกเหนือจาก visualization หรือ “digital twin” ในอุตสาหกรรมไหม ในอนาคตอันใกล้จะแก้ไขหรือทำเป็นแอนิเมชันได้ไหม และจะมีประโยชน์กับงานสร้างสรรค์กับเกมเมื่อไร
      [1] https://github.com/aframevr/aframe
      [2] https://playcanvas.com/

  • ลิงก์ repository อยู่ตรงนี้ เพื่อให้เห็นชัดขึ้นอีกหน่อย: https://github.com/sparkjsdev/spark

  • เจ๋งมาก
    อยากรู้ว่าตอนนี้ คอขวดด้านประสิทธิภาพ อยู่ตรงไหน โดยเฉพาะมี insight อะไรเกี่ยวกับฉากแบบ dynamic บ้าง
    ตัวอย่าง particle simulation กระตุก แต่พอหมุนกล้องแล้วดีขึ้นมาก ดูเหมือนว่าฉากหลังแบบ static จะหนักกว่าที่เห็นมาก
    ในทางกลับกัน นอกเหนือจากเรื่องคอขวดแล้ว พีระมิด Sierpinski ที่สร้างแบบ procedural นั้นยอดเยี่ยมมาก

    • จำนวน splat ในฉากและการกระจายตัวมีผลต่อประสิทธิภาพ
      เป็นไปได้ว่าคุณหมุนกล้องไปทางที่มี splat น้อยกว่า
      ยังมีงานต้องทำอีกมากเพื่อให้ประสิทธิภาพสม่ำเสมอ และถัดไปก็น่าจะไปดู ระบบ LOD

  • ยังค่อนข้างสงสัยว่า Gaussian splatting มีความหมายมากกว่าเดโมหรือยัง
    ไฟล์ใหญ่เกินไป เช่น แซนด์วิชสเต๊กชิ้นเดียวก็ 12MB แล้ว
    ใน SIGGRAPH ปีที่แล้วมีงานจำลอง Matterport ที่ใช้ Gaussian splatting แต่แค่จะดูอะพาร์ตเมนต์ 2 ห้องก็ต้องสตรีม 1.5GB
    ตัวเดโมเองเจ๋งดี

    • ต้องดูด้วยว่าแซนด์วิชสเต๊ก 12MB นั้นเป็นหนึ่งในรายการที่ใหญ่ที่สุด
      ที่เหลือส่วนใหญ่ต่ำกว่า 10MB และหลายอันที่ดูน่าเชื่อมากก็อยู่ในช่วง 1–3MB เช่น Iberico Sandwich ขนาด 1MB, Clams and Caviar ขนาด 1.8MB
      วิธีบีบอัดขั้นสูงกว่านี้ก็กำลังมา เช่น SOGS อันนี้ 30MB
      https://vincentwoo.com/3d/sutro_tower/
    • การบีบอัด SOGS ใช้งานได้ดี
      สามารถใส่ Gaussian 1 ล้านตัวพร้อมค่าสัมประสิทธิ์ spherical harmonics ทั้งหมดได้ในประมาณ 14MB
      มีบทความดี ๆ ในบล็อก PlayCanvas: https://blog.playcanvas.com/playcanvas-adopts-sogs-for-20x-3...
    • ขนาดไฟล์ใหญ่ส่วนใหญ่มาจากการเก็บ ค่าสัมประสิทธิ์ spherical harmonics และนี่เป็นปัญหาที่แก้ได้

  • งานเจ๋งดี แต่ใน Firefox บนโน้ตบุ๊กที่มี Nvidia RTX A3000 GPU ประสิทธิภาพค่อนข้างแย่
    เครื่องนี้มี shader cores มากพอที่จะทำให้เกิดแผลไหม้ระดับหนึ่งได้เลย

    • เป็นกับเดโมหรือตัวอย่างเฉพาะอันไหนหรือเปล่า?

  • จะเป็นไปได้ไหมที่จะถือมือถือเดินไปรอบ ๆ แล้วจับ Gaussian splat ของสิ่งอย่างหญ้า พุ่มไม้ ดิน
    แล้วเลือกแผ่นดินขนาด 1 ตารางเมตร หรือพื้นที่ลูกบาศก์ 1 เมตรที่มีพุ่มไม้ จากนั้นปูก้อนหญ้าซ้ำ ๆ และผสมดินกับพุ่มไม้เป็นครั้งคราว เพื่อสร้างโลกที่ “ดูเหมือน Minecraft”
    ถ้าจะเรนเดอร์บล็อกหลายพันก้อนคงต้องใช้ฮาร์ดแวร์ค่อนข้างแรง

    • ต้นแบบแบบนั้นน่าจะทำได้แน่นอน
      ถ้าได้เห็นจริงคงดูเจ๋งมาก

  • ดูเจ๋งมากจริง ๆ
    ตอนเปิดเว็บเพจในเว็บเบราว์เซอร์ มันจะทำงานใน VR ได้ด้วยไหม? ถ้าได้คงยิ่งสุดยอด

    • ทำงานใน VR ได้ เดี๋ยวจะปล่อยเดโมเร็ว ๆ นี้