on
Cheng Lou วิศวกรซอฟต์แวร์จาก Midjourney และเคยทำงานที่ Apple และ Meta ปล่อย Pretext ไลบรารีสำหรับการคำนวณขนาดข้อความเมื่อเรนเดอร์ด้วยฟอนต์ต่างๆ
ปกติแล้วการวัดขนาดข้อความใน JavaScript/TypeScript จะอาศัยการเรนเดอร์ใน DOM ของเบราว์เซอร์แล้วขอขนาด DOM จากเบราว์เซอร์ ปัญหาคือกระบวนการนี้กินพลังประมวลผลสูงมาก แต่ Pretext สร้างกระบวนการวัดขนาดข้อความด้วยตัวเอง
แนวทางของ Pretext จะแบ่งการทำงานเป็นสองส่วน คือ prepare สำหรับการระบุข้อความ, ฟอนต์, และขนาดฟอนต์ ระบบจะแบ่งคำหาจุดตัดของคำไว้ล่วงหน้า จากนั้นผู้ใช้สามารถสั่ง layout โดยระบุความกว้างของพื้นที่ข้อความ เพื่อขอจำนวนบรรทัดที่จะเรนเดอร์และความสูงของพื้นที่ข้อความ
การใช้ Pretext ทำให้นักพัฒนาเว็บสามารถกำหนดการเรนเดอร์ข้อความได้อย่างละเอียดโดยไม่ต้องพึ่งเอนจินของเบราว์เซอร์ เช่น การออกแบบเว็บที่พยายามเรนเดอร์ข้อความให้เต็มบรรทัดเสมอ, การแทรกภาพในข้อความแบบนิตยสาร
ตอนนี้ Pretext มียอด Star บน GitHub มากกว่า 30,000 ดาว และนับเป็นโครงการโอเพนซอร์สที่ได้รับความนิยมเร็วที่สุดโครงการหนึ่ง
ที่มา - GitHub: chenglou/pretext
โดยไม่ต้องพึ่งเอนจินของเบราว…
rattananen Thu, 02/04/2026 - 10:02
🤔 แบบนี้มันน่าจะยากกว่าเดิมไหม
ยากกว่าแต่ในกรณีที่ต้องการคว…
lew Thu, 02/04/2026 - 11:23
In reply to โดยไม่ต้องพึ่งเอนจินของเบราว… by rattananen
ยากกว่าแต่ในกรณีที่ต้องการความเนียนความเนี้ยบ มันทำได้ดีกว่าครับ
ลองอ่านซ้ำๆ + ลองเปิด source…
rattananen Thu, 02/04/2026 - 13:20
In reply to ยากกว่าแต่ในกรณีที่ต้องการคว… by lew
ลองอ่านซ้ำๆ + ลองเปิด source ดู
แล้วเข้าใจว่า web dev ทั้วไปเวลาจะ measure text
จะใช้วิธี create DOM element -> ใส่ text แล้วใช้ property clientWidth, clientHeight หรือเปล่าครับ? (ใครทำแบบนี้อยู่แนะนำให้แก้นะครับ)
เพราะถ้าเป็นผมจะใช้ measureText ซึ่ง performance น่าจะดีกว่า
code ใน library ก็น่าจะใช้อันนี้หมือนกัน ที่แรกก็นึกว่าเปิด font อ่าน data มาคำนวณเอาเลย จะได้ลอก algorithm ไปใช้สักหน่อย