D2: ภาษาสคริปต์สำหรับไดอะแกรม

 (d2lang.com)
3 คะแนน โดย GN⁺ 2025-10-27 | 1 ความคิดเห็น | แชร์ทาง WhatsApp
  • D2 คือ ภาษาสคริปต์ ที่ใช้สร้างไดอะแกรมแบบอิงข้อความ โดยนำเสนอวิธีสร้างสื่อภาพอัตโนมัติด้วยโค้ด
  • ผู้ใช้สามารถกำหนดโหนดและความสัมพันธ์ด้วยไวยากรณ์ที่เรียบง่าย แล้ว เอนจินจัดวางอัตโนมัติ จะจัดวางให้ออกมาเป็นภาพ
  • โค้ดสไนเป็ตแต่ละชิ้นในเอกสารสามารถ รันและแก้ไขได้โดยตรงใน Playground ทำให้ตรวจสอบผลลัพธ์ได้ทันที
  • อย่างไรก็ตาม ตัวอย่างบางส่วนที่ใช้ import เป็นข้อยกเว้นที่ไม่สามารถรันได้ทันทีใน Playground
  • เป็นเครื่องมือที่มีความหมายสำหรับนักพัฒนาในการเพิ่ม ระบบอัตโนมัติของการจัดทำเอกสารเชิงภาพและประสิทธิภาพการทำงานร่วมกัน

ภาพรวมของ D2

  • D2 คือ ภาษาสคริปต์เชิงประกาศ ที่ช่วยให้เขียนไดอะแกรมด้วยโค้ดได้ โดยสามารถกำหนดโครงสร้างที่ซับซ้อนด้วยข้อความและแปลงเป็นภาพโดยอัตโนมัติ
    • ผู้ใช้สามารถอธิบายโหนด เส้นเชื่อม และกลุ่มต่าง ๆ ด้วยไวยากรณ์ที่เรียบง่าย
    • ผลลัพธ์จะถูกจัดเรียงอัตโนมัติ และสามารถใช้สไตล์ได้หลากหลาย
  • ภาษานี้เหมาะกับ การควบคุมเวอร์ชันและการทำงานร่วมกัน และผสานเข้ากับการรีวิวโค้ดหรือไปป์ไลน์อัตโนมัติของเอกสารได้ง่าย

ความสามารถของ Playground

  • โค้ดสไนเป็ตแต่ละชิ้นในเอกสาร D2 มีความสามารถแบบอินเทอร์แอ็กทีฟที่ เปิด แก้ไข และรันได้ทันทีใน Playground
    • ผู้ใช้สามารถเลื่อนเมาส์ไปเหนือสไนเป็ตเพื่อให้ลิงก์ Playground ทำงาน
    • ด้วยวิธีนี้จึงสามารถปรับไดอะแกรมแบบเรียลไทม์และตรวจสอบผลลัพธ์ในรูปแบบภาพได้
  • แต่ สไนเป็ตที่ใช้คำสั่ง import มีข้อจำกัดคือไม่สามารถรันได้ทันทีใน Playground เพราะต้องใช้ทรัพยากรภายนอก

ความสำคัญในการใช้งาน

  • D2 รองรับ ระบบอัตโนมัติของการจัดทำเอกสารเชิงภาพ ทำให้มีข้อดีในการจัดการการออกแบบระบบหรือการไหลของข้อมูลร่วมกับโค้ด
  • การที่นักพัฒนาและนักออกแบบกำหนดไดอะแกรมด้วยภาษาเดียวกัน ช่วยเพิ่ม ประสิทธิภาพการทำงานร่วมกัน
  • ได้รับการประเมินว่าเป็นเครื่องมือที่ช่วยผลักดัน การสร้างมาตรฐานการเขียนไดอะแกรมด้วยโค้ด ในระบบนิเวศโอเพนซอร์ส

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

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

 
GN⁺ 2025-10-27
ความคิดเห็นบน Hacker News

  • ในฐานะผู้ร่วมสร้าง D2 กำลังคิดไอเดียขยาย ความสามารถด้านแอนิเมชัน อยู่ในช่วงนี้
    ได้โพสต์ประเด็นไว้ใน GitHub Discussion แล้ว จึงอยากฟังความเห็น

    • ช่วงนี้กำลังใช้ LLM เพื่อทำภาพสรุปการตัดสินใจด้านสถาปัตยกรรมได้อย่างรวดเร็ว
      ปกติใช้ mermaid เป็นหลัก แต่ก็สงสัยว่า D2 จะให้ อินเทอร์เฟซที่ยืดหยุ่นกว่า ได้หรือไม่
      และอยากรู้ด้วยว่ามีแผนสำหรับ ความสามารถในการเรียกใช้เครื่องมือ ที่เชื่อมกับ LLM หรืออินเทอร์เฟซที่เป็นมิตรกับผู้ใช้แบบ MCP หรือไม่
    • คิดว่า D2 เป็นเครื่องมือที่ยอดเยี่ยมมาก โดยเฉพาะตอนทำ ระบบอัตโนมัติสำหรับ AWS network layout ซึ่งมีประโยชน์มาก
      แม้จะต้องเรนเดอร์ออบเจ็กต์จำนวนมากก็ไม่ต้องคอยสู้กับเอนจิน จึงชอบมาก
      แต่เอกสารของ sdk/d2lib ยังมีน้อย ทำให้ช่วงแรกต้องลองผิดลองถูกพอสมควร
    • ใช้ D2 มาตั้งแต่ไม่กี่เดือนก่อนและแปลกใจที่เรียนรู้ได้ง่าย
      แต่ไม่คิดว่า แอนิเมชันหวือหวา จะจำเป็นนัก ถ้าต้องการเน้นจุดสำคัญ แค่เปลี่ยนสีก็ดูตรงไปตรงมากว่า
    • สงสัยว่าเป้าหมายของแอนิเมชันคืออะไร ถ้าระหว่างพรีเซนต์มีการคลิกแล้วองค์ประกอบค่อย ๆ เพิ่มเข้ามา พร้อมกับ การเน้นเส้นเชื่อมอย่างนุ่มนวล ก็น่าจะดี
      แต่ถ้าการเปลี่ยนข้อความทำให้ไดอะแกรมทั้งภาพสั่นไปหมด ก็อาจจะยิ่งรบกวนสายตามากกว่า
      นอกจากนี้ก็น่าจะมีการรองรับ Swimlane diagram อย่างเป็นทางการด้วย
    • มีการแชร์ ตัวอย่าง SVG แบบดรามาติก พร้อมแซวว่า “Level 4 - dramatic mode ;)”

  • กำลังลองห่อเครื่องมืออย่าง D2 หรือ Penrose ด้วย Python เพื่อทำ การเขียนสคริปต์ไดอะแกรมแบบขับเคลื่อนด้วยข้อมูล
    แต่เครื่องมือเชิงประกาศส่วนใหญ่ไม่รองรับเวิร์กโฟลว์แบบ “declare, then tweak” จึงใช้งานไม่สะดวก
    Penrose แก้ไขได้ง่ายก็จริง แต่ผลลัพธ์มีความ สุ่มและคาดเดาไม่ได้ อยู่บ้าง

    • การ ปรับแต่งเลย์เอาต์แบบกำหนดเอง ของ D2 ทำได้เฉพาะในเอนจินแบบ proprietary
      ในเอนจินโอเพนซอร์สยังทำไม่ได้ แต่พอปรับบางส่วนได้ด้วย ฟีเจอร์ Freehand

  • เคยสงสัยว่าไวยากรณ์ของ D2 จะทำให้ใกล้กับภาษาการเขียนโปรแกรมทั่วไปได้แค่ไหน
    ใน Python นั้นทำ DSL ให้เหมือนกันทุกอย่างได้ยากเพราะข้อจำกัดของ operator overloading แต่ก็พอทดลองให้คล้ายกันได้ด้วย operator overloading ของสตริง

    • ใน Python ก็พอเลียนแบบไวยากรณ์อย่าง a <- b | "edge" ได้ด้วยเทคนิคนิดหน่อย
      แต่ก็ล้อเล่นว่าถ้าเอาไปใช้จริงจะ กลายเป็นผีมาหลอกหลอน
    • ใน Scala สามารถมี โอเปอเรเตอร์ที่ผู้ใช้กำหนดเอง ได้ จึงทำ DSL อย่าง "x" --> "y" | "hello world" ได้
      แต่การใช้มากเกินไปก็ไม่ใช่เรื่องดี
    • ใน Ruby ก็ทำ internal DSL แบบง่าย ๆ ได้ในรูป x >> y << "label"
      อาจสร้าง object model ในคลาส Diagram แล้วค่อยต่อเรนเดอเรอร์เข้าไปก็ได้

  • ในฐานะผู้เขียนหลักของโปรเจ็กต์ mgmt ต้องทำงานกับ DAG อยู่มาก
    เวลามีการเพิ่มหรือลบโหนดกับเอดจ์ จึงต้องการไดอะแกรมที่ เสถียรในเชิงภาพและมีทรานซิชันแบบแอนิเมชันได้
    Graphviz มีปัญหาเลย์เอาต์ขยับไปมาทุกครั้งที่เป็น snapshot จึงไม่สะดวก

    • สามารถทำเอฟเฟกต์คล้ายกันได้ด้วย การแฮ็กสคริปต์แบบง่าย ๆ ที่ใช้ฟังก์ชัน watch ของ d2 เพื่อสลับไฟล์ทีละขั้น

  • โหมด Sketch และ ความสามารถแบบ interactive ของ D2 มีประโยชน์มากจริง ๆ
    ทูลทิปและลิงก์ ทำให้การนำไดอะแกรมไปใช้งานมีคุณค่ามากขึ้นอย่างมาก

  • ใช้ D2 มานานและยังแนะนำภายในองค์กรอย่างจริงจัง
    แต่ ค่าไลเซนส์สำหรับองค์กร สูงเกินไป จึงใช้งานแค่ส่วนตัว
    ไลเซนส์ TALA อยู่ที่ 3,000 ดอลลาร์ต่อปี และแบบบุคคลก็ 120 ดอลลาร์ ซึ่งถือว่าหนักพอสมควร
    มองว่าความสามารถในการเอา Helm chart หรือคำอธิบายระบบใส่เข้า LLM เพื่อ สร้างไดอะแกรมอัตโนมัติ เป็นสิ่งที่พลิกเกมมาก

    • โดยส่วนตัวรู้สึกว่าคุณภาพเอาต์พุตของ TALA แย่ที่สุด และส่วนใหญ่จะใช้ เอนจิน ELK

  • ไม่นานมานี้การรองรับ การเรนเดอร์แบบ ASCII ของ D2 กลายเป็นประเด็นพูดถึงกันมาก
    การพูดคุยที่เกี่ยวข้องต่อเนื่องมาจากโพสต์ก่อนหน้า

  • D2 มีมาค่อนข้างนานแล้ว แต่ก็ยังดู เป็นที่รู้จักน้อยกว่า mermaid อยู่
    ทั้งที่ด้านความสามารถนั้นเหนือกว่ามาก จึงอยากให้คนรู้จักมากกว่านี้

    • ฉันเองก็ชอบ D2 มากกว่า แต่ mermaid เป็นตัวเลือกที่ใช้งานได้จริงเพราะมี การรองรับเป็นค่าเริ่มต้น ในหลายแพลตฟอร์ม
    • เพิ่งรู้จัก D2 เป็นครั้งแรก จึงสงสัยว่ามันดีกว่า mermaid อย่างไร

  • บนแพลตฟอร์ม AI ของเรา zo.computer ได้นำ D2 มาใช้เป็น เครื่องมือสร้างไดอะแกรม
    มันแสดงออกได้มากกว่า mermaid จึงเหมาะกับ การทำภาพด้วย AI

    • สงสัยว่าทำอย่างไรในการใช้งานนี้ ได้สร้าง MCP server สำหรับ D2 ขึ้นมาเองหรือไม่
    • มีคนทักว่า “Ben ขอบคุณที่ทำให้ LinkedIn/X พอทนได้”

  • D2 ยอดเยี่ยมก็จริง แต่เมื่อเทียบกับ PlantUML หรือ mermaid แล้ว ยังขาด จุดแตกต่างที่ชี้ขาด
    หลายคนยังคงรอ “killer app ของไดอะแกรมแบบเขียนเป็นโค้ด” อยู่

    • ถ้าเครื่องมือพวกนี้ช่วยให้ สำรวจโค้ดเบสขนาดใหญ่ในเชิงภาพ ได้ ก็น่าจะเป็นข้อได้เปรียบมาก
    • จุดเด่นของ D2 คือเป็นคอมไพเลอร์แบบ standalone และรองรับ การเรนเดอร์แบบ ASCII
      ที่ไม่ต้องติดตั้ง npm ก็เป็นข้อดีที่ชอบ
      แต่ mermaid ก็เด่นมากในด้านการเชื่อมรวมกับเครื่องมืออย่าง Obsidian
    • มีคนตั้งคำถามว่า “แล้ว killer program นั้นควรมีฟีเจอร์อะไรบ้าง?”