Branch of Thought – ส่วนขยาย Chrome ที่แสดงกิ่งสาขาที่ซ่อนอยู่ของบทสนทนา Claude·ChatGPT เป็นกราฟ

เมื่อแก้ไขข้อความใน Claude หรือ ChatGPT บทสนทนาจะค่อย ๆ แตกออกเป็นกิ่งสาขาใหม่โดยที่เราแทบไม่รู้ตัว แต่บทสนทนาก่อนหน้ากลับถูกซ่อนไว้หลังลูกศรเล็ก ๆ ‹ 2/3 › ทำให้พลาดกิ่งที่อยากย้อนกลับไปดูอยู่บ่อย ๆ ผมเลยทำมันขึ้นมาเอง

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

สิ่งที่ยากที่สุดตอนทำคือโครงสร้างการเก็บบทสนทนาของ Claude กับ ChatGPT ต่างกันโดยสิ้นเชิง ChatGPT เปิดเผยต้นไม้ mapping ออกมา แต่ Claude ไม่ได้ทำแบบนั้น ผมเลยสร้างตัวปรับให้เป็นรูปแบบเดียวกันตัวหนึ่งเพื่อพับทั้งสองแบบให้อยู่ในโครงสร้างเดียวกัน ด้วยเหตุนี้ logic ด้านล่างทั้งหมดจึงทำงานได้โดยไม่ผูกกับแพลตฟอร์ม และทำให้การเพิ่มแพลตฟอร์มที่สองง่ายขึ้นมาก

มันสร้างบนพื้นฐาน MV3 และ content script ที่ทำงานใน MAIN world จะอ่านข้อมูลบทสนทนาที่เบราว์เซอร์รับมาแล้ว ดังนั้นทุกอย่างจึงประมวลผลในเครื่องทั้งหมด ไม่มีเซิร์ฟเวอร์ การวิเคราะห์ข้อมูล หรือเทเลเมทรี มีตัวเลือกให้สรุปชื่อโหนดเป็นหนึ่งบรรทัดด้วย Claude Haiku ซึ่งจะใช้ API key ของผู้ใช้เอง และสรุปเพียงครั้งเดียวต่อข้อความพร้อมแคชไว้

นี่เป็นส่วนขยายเบราว์เซอร์ตัวแรกของผม จึงยังมีส่วนที่หยาบอยู่มาก ผมไม่ได้เอาขึ้นเว็บสโตร์และก็ไม่ได้วางแผนจะเอาขึ้นในอนาคต โดยจะใช้วิธีโหลดแบบแตกไฟล์เองแทน ดังนั้นก่อนรันคุณสามารถตรวจโค้ดได้อย่างชัดเจนว่ามันทำอะไรบ้าง
เป็นไลเซนส์ MIT และรองรับทั้ง Claude กับ ChatGPT
ผมอยากได้ฟีดแบ็กเกี่ยวกับแนวทาง UX หรือ edge case ที่ผมอาจมองข้ามไป ถามมาได้สบาย ๆ ครับ