"ก็ได้ เดี๋ยวเขียน text editor เอง" — บทเรียนจาก canvas สู่ contenteditable สู่ textarea
Fine, I'll build my own text editor
David Bushell เขียนบันทึกการทดลองสร้าง text editor บนเว็บของตัวเองเมื่อวันที่ 1 กันยายน 2026 แรงจูงใจมาจากความรู้สึกว่าคุณภาพซอฟต์แวร์สมัยใหม่ถดถอยลง บวกกับความคิดถึงงานฝีมือระดับ Sublime Text
แนวทางแรกคือเรนเดอร์ทุกอย่างบน `<canvas>` ซึ่งให้เฟรมเรต 60–120 fps และควบคุมได้ทุกพิกเซล แต่ติดข้อจำกัดพื้นฐานด้าน accessibility อย่างหนัก และต้องเขียนฟีเจอร์พื้นฐานทุกอย่างเองตั้งแต่การเลือกข้อความไปจนถึง undo/redo
แนวทางที่สองคือใช้แอตทริบิวต์ `contenteditable="plaintext-only"` ซึ่งเข้าถึงได้ดีกว่ามาก เพราะยืมกลไกเลือกข้อความและประวัติ undo ของเบราว์เซอร์มาใช้ได้ทันที แต่ประสิทธิภาพกลับตกลงอย่างคาดเดาไม่ได้เมื่อเอกสารยาวเกินจำนวนอักขระระดับหนึ่ง
แนวทางสุดท้ายที่ผู้เขียนเลือกใช้จริงคือ `<textarea>` มาตรฐาน ซึ่งให้ประสิทธิภาพดีที่สุดกับเอกสารยาว โดยเพิ่ม syntax highlighting ผ่านเลเยอร์แยกที่ใช้ MicroLighter ทับอยู่ด้านหลัง
บทเรียนที่ตกผลึกมีสองข้อ ข้อแรกคือแอตทริบิวต์อย่าง `spellcheck` ทำให้เกิด latency spike ในการพิมพ์และต้องปิดทิ้ง ข้อที่สองซึ่งสำคัญกว่าคือ การใช้ค่าเริ่มต้นของเบราว์เซอร์มักให้ผลดีกว่าการเขียนใหม่เองทั้งหมด — แนวทาง canvas ที่ดูควบคุมได้เต็มที่ กลับเข้าถึงไม่ได้และฟีเจอร์น้อยกว่าโซลูชัน HTML ดั้งเดิมอย่างชัดเจน