เชดเดอร์

[GN⁺]

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

• บทความน่าสนใจ แต่ส่วนที่แผนภาพแสดงให้เห็นว่า OpenGL / WebGL / WebGPU ถูกสร้างอยู่บน Vulkan นั้นอธิบายผิด
  WebGL และ WebGPU ทำงานอยู่บน D3D และ Metal โดยตรง ไม่ได้ผ่าน Vulkan
  อีกทั้ง Vulkan ไม่ใช่โอเพนซอร์ส แต่เป็นมาตรฐาน
  WebGPU ไม่ได้จำกัดอยู่แค่ในเบราว์เซอร์ และยังมีไลบรารี Dawn สำหรับ C++ และ WGPU สำหรับ Rust จึงรันได้บน Windows, macOS, Linux, iOS, Android เป็นต้น
  Vulkan ทำงานได้บนแพลตฟอร์มมากกว่า DirectX เล็กน้อย แต่ไม่ได้รวมมากับ Windows โดยค่าเริ่มต้น และรันบน macOS หรือ iOS ไม่ได้
  • อยากเสริมว่า Vulkan ไม่ใช่โอเพนซอร์ส แต่เป็น มาตรฐานเปิด
    ตัว implementation จริงเป็นหน้าที่ของผู้ผลิตฮาร์ดแวร์แต่ละราย และ Vulkan เองก็เป็นเพียงไฟล์ header เท่านั้น
    นอกจากนี้ยังทำงานได้ดีบนแพลตฟอร์มของ Apple ผ่านชั้นแปลง Vulkan-to-Metal อย่าง MoltenVK หรือ KosmicKrisp
  • แม้ Vulkan จะไม่ใช่ cross-platform แบบสมบูรณ์ แต่ก็รองรับได้กว้างกว่า DirectX มาก
    DirectX ใช้กับ Windows และ Xbox ส่วน Vulkan ใช้ได้กับ Linux, Android, Windows, Nintendo Switch, Switch 2 เป็นต้น
  • ควรกล่าวด้วยว่า WebGPU เป็น API แบบรวมศูนย์ ที่อยู่เหนือ native API ของแต่ละแพลตฟอร์มอย่าง DirectX, Vulkan, Metal
  • API ของ Khronos มี ส่วนขยาย อยู่จำนวนมาก แต่บางส่วนเป็นแบบปิดเฉพาะค่าย ทำให้พกพาได้ไม่ดี
    PlayStation ไม่รองรับ Vulkan และบน Switch ก็มักใช้ NVN มากกว่า OpenGL/Vulkan
  • แค่ Vulkan รันบน Windows ได้ก็มองว่ามีความเป็นอเนกประสงค์กว่า DirectX แล้ว
    การที่ Vulkan ใช้ไม่ได้ในบางสภาพแวดล้อม Linux VNC ไม่ใช่กรณีทั่วไป
    ผู้ใช้ส่วนใหญ่รองรับ Vulkan ผ่านไดรเวอร์ GPU อยู่แล้ว
• คุณภาพของคอร์ส ในเว็บไซต์นี้น่าทึ่งมาก
  ถ้าหนังสือเปิดขายแม้จะเป็นแบบพรีออร์เดอร์ก็อยากสนับสนุนโปรเจกต์นี้
  ติดตามมาตั้งแต่บทความแรก และแต่ละบทความก็น่าประทับใจขึ้นเรื่อย ๆ
• ถ้าอยากลองเล่นกับเชดเดอร์ ขอแนะนำ IDE ต่อไปนี้
  • shadertoy – ใช้ง่ายและนิยมที่สุด เพราะทำงานบนเบราว์เซอร์
  • Shadron – ใช้งานสะดวก เลยชอบเป็นการส่วนตัว แต่ค่อนข้าง niche
  • SHADERed – ต้องใช้เวลาทำความคุ้นเคยกับ UX แต่ฟีเจอร์ครบพอสมควร
  • KodeLife – เคยได้ยินชื่อ แต่ยังไม่เคยลองใช้เอง
  • Cables(cables.gl) ก็เจ๋งมากเช่นกัน
    มีผลงานที่น่าประทับใจของ Kirell Benzi
  • เจอ wgshadertoy ใน software manager ของ Mint
    รองรับหลายแพลตฟอร์มทั้ง flatpak, AUR, macports, Windows
  • บน macOS หรือ iPadOS สามารถเริ่มต้นกับ Metal shader ได้ง่าย ๆ ผ่าน Playgrounds
  • ยังมี Bonzomatic ที่ใช้ในการแข่งขัน live coding เชดเดอร์ของเดโมซีนด้วย
• การเขียนโปรแกรมก็คือกระบวนการแปลงสิ่งที่มนุษย์เข้าใจให้คอมพิวเตอร์เข้าใจ
  แต่ การเขียนโปรแกรม GPU นั้นยากกว่ามาก
  มีทั้งกับดักมากมาย ความไม่สอดคล้องกันระหว่างฮาร์ดแวร์/ซอฟต์แวร์ และเครื่องมือดีบักที่ขาดแคลน ทำให้ประสบการณ์พัฒนาแย่มาก
  น่าเสียดายที่ชุมชนเองก็เหมือนไม่ค่อยตั้งใจแก้ปัญหานี้
  • OpenGL และ DirectX เวอร์ชันก่อน 12 เป็นความพยายามที่จะ abstraction รายละเอียดของฮาร์ดแวร์ แต่สุดท้าย abstraction กลับให้ผลเสียมากกว่า
• เวลาจะเขียน fragment shader ส่วนที่ ไม่เป็นธรรมชาติที่สุด คือแนวคิดที่รับพิกัดเข้ามาแล้วส่งสีออกไป
  ต่างจากการวาดรูปด้วยปากกา เชดเดอร์จะคำนวณตำแหน่งของแต่ละพิกเซลแล้วตัดสินใจเลือกสี
  แทนที่จะขยับวัตถุ คุณต้องคิดในแบบ จัดการกับอวกาศ/พื้นที่
  vertex shader จะส่งออกตำแหน่งของสามเหลี่ยม จึงรู้สึกเป็นธรรมชาติมากกว่า
  • จะรู้สึกไม่เป็นธรรมชาติก็ต่อเมื่อใช้ fragment shader เกินความเหมาะสมเท่านั้น
    ในความเป็นจริงมันมีหน้าที่ดูแล ขั้นตอนสุดท้ายของ rendering pipeline อย่างการ sample texture และคำนวณแสง
    ในงาน PBR หรือ deferred rendering ส่วนใหญ่จะใช้เชดเดอร์ร่วมกัน และคัสตอมเฉพาะเอฟเฟกต์พิเศษ
  • นี่ไม่ใช่ปัญหาของตัวเชดเดอร์เอง แต่ควรมองว่าเป็นความต่างระหว่าง raster กับ vector graphics
    การ shading ไม่ใช่การวาดเส้นขอบ แต่เป็นกระบวนการแสดงวัสดุแบบอิงฟิสิกส์
    งานจิตรกรรมใกล้เคียงกับ shading มากกว่า แต่ภาพวาดด้วยปากกาไม่ใช่
  • การใช้ fragment shader เพื่อวาดสี่เหลี่ยมเป็นแนวทางที่ผิด
    เชดเดอร์มีไว้เพื่อ ทำ shading ให้กับสี่เหลี่ยม
  • ในทางปฏิบัติ vertex shader เป็นตัวกำหนดขอบเขต และ fragment shader เป็นตัวเติมด้านใน
    สำหรับการสอน บางครั้งก็ละ vertex shader ออกไป แล้วใช้ fragment shader เติมทั้งหน้าจอแทน
• ตอนเรียนรู้โค้ด GPU สิ่งที่ยากที่สุดคือ การตั้งค่าเริ่มต้นที่ซับซ้อนและเข้าใจยาก
  ทั้งฟอร์แมตข้อมูล ลำดับการแปลง ขอบเขตระหว่าง CPU-GPU ล้วนเป็นแนวคิดที่ยาก และเอกสารก็มีไม่มาก
  ระบบตัวแปร global ของ GPU ก็ชวนสับสนเช่นกัน
  • ฉันเองก็มีคำถามแบบเดียวกันเยอะมาก เลยเขียนบทความบล็อกไว้สำหรับเรียน WebGL
    Barebones WebGL in 75 lines,
    Barebones 3D rendering with WebGL
    Vulkan ต้องใช้ boilerplate code มากกว่า WebGL อีกเยอะ
  • คำถามบางส่วนไม่ได้เกี่ยวกับตัว GPU โดยตรง แต่เกี่ยวกับ การออกแบบ API
    GPU ใช้โครงสร้างแบบ SIMT ดังนั้นความสม่ำเสมอของการเข้าถึงข้อมูลจึงสำคัญ
    การแปลงจะถูกใช้แบบลำดับภายในแต่ละเธรด และขอบเขตระหว่าง CPU-GPU สามารถข้ามไปมาได้หลายครั้งตามงบประมาณด้านประสิทธิภาพ
    ตัวแปร global มีลักษณะเป็นค่าคงที่ที่ส่งเหมือนกันให้ทุกเธรด เช่น uniform
    ใน CUDA สามารถเข้าถึง global ได้ด้วยการทำ atomic operation แต่ประสิทธิภาพจะลดลงมาก
    คอร์สเริ่มต้น WebGL น่าจะเป็นจุดเริ่มต้นที่ดี
• เว็บไซต์นี้มีความสมบูรณ์สูงจนน่าทึ่ง
  ทั้งแผนภาพ แถบเลื่อน และสไตล์ ล้วนยอดเยี่ยม
  เชดเดอร์เกิดขึ้นก่อน GPU และสามารถรันบน CPU ได้เช่นกัน
  แก่นสำคัญของ GPU คือ โมเดลการทำงานแบบ SIMT/SIMD และเชดเดอร์โดยเนื้อแท้แล้วมีแนวคิดแบบ callback function
  ผมคิดว่าการที่มันเขียนได้ด้วยวิธีคิดเชิงลำดับแบบเดียวกับ CPU คือสิ่งที่ทำให้เชดเดอร์ทั้งเรียบง่ายและสง่างาม
  • สิ่งที่น่าประทับใจเป็นพิเศษคือภาพประกอบทั้งหมดทำด้วย Figma
  • ตอบกลับไปว่าฟีดแบ็กยอดเยี่ยมมาก
• ผลงานสวยงามมากและเก็บรายละเอียดได้ดีมาก
  • เห็นด้วย 100% สงสัยว่าเว็บไซต์นี้เป็นแอปคัสตอมที่สร้างด้วย Next.js หรือเปล่า
• งานยอดเยี่ยม ดูเพลินมากตลอดทั้งชิ้น
• ขอแนะนำวิดีโอของ Iñigo Quilez ชื่อ “This painting is a mathematical formula”
  มันอธิบายแนวคิดของเชดเดอร์ที่แทนพิกเซลแต่ละจุดด้วยฟังก์ชันของพิกัด x, y ได้ดีมาก