เผยแพร่เมื่อวันที่ 24 มิถุนายน 2025
เรากำลังเปิดตัว Chrome 138 อยู่ และโพสต์นี้จะแชร์ฟีเจอร์หลักๆ จากรุ่นนี้ อ่านบันทึกประจำรุ่นของ Chrome 138 ฉบับเต็ม
ไฮไลต์จากรุ่นนี้
- ใช้ AI API ในตัวใหม่เพื่อสรุป แปล หรือตรวจหาภาษาของข้อความ
- ดูฟังก์ชัน CSS ใหม่หลายรายการ
- ปรับเลย์เอาต์เว็บเพื่อกำหนดเป้าหมายไปยังอุปกรณ์แบบพับได้ด้วย Viewport Segments API
Translator, Language Detector และ Summarizer API
Chrome กำลังพัฒนา API แพลตฟอร์มเว็บและฟีเจอร์เบราว์เซอร์ที่ออกแบบมาเพื่อทำงานร่วมกับโมเดล AI, โมเดลผู้เชี่ยวชาญ และโมเดลภาษาขนาดใหญ่ (LLM) ที่สร้างขึ้นภายในเบราว์เซอร์ ซึ่งรวมถึง Gemini Nano ซึ่งเป็น LLM ตระกูล Gemini เวอร์ชันที่มีประสิทธิภาพมากที่สุด ซึ่งออกแบบมาเพื่อทำงานแบบออนไฮเดรตในคอมพิวเตอร์เดสก์ท็อปและแล็ปท็อปที่ทันสมัยส่วนใหญ่ เมื่อใช้ AI ในตัว เว็บไซต์หรือเว็บแอปพลิเคชันจะทํางานด้วยระบบ AI ได้โดยไม่ต้องติดตั้งใช้งาน จัดการ หรือโฮสต์โมเดล AI ด้วยตนเอง
ตั้งแต่ Chrome 138 เป็นต้นไป คุณสามารถเพิ่มความสามารถในการแปลภาษาลงในเว็บแอปพลิเคชันได้ด้วย Translator API ซึ่งจะช่วยให้ผู้ใช้มีส่วนร่วมในภาษาแม่ได้ ตัวอย่างเช่น เมื่อเข้าร่วมแชทสนับสนุน เว็บไซต์สามารถแปลเนื้อหาเป็นภาษาที่ตัวแทนฝ่ายสนับสนุนใช้ก่อนที่จะส่งออกจากอุปกรณ์ของผู้ใช้ ซึ่งจะมอบประสบการณ์การใช้งานที่ราบรื่น รวดเร็ว และครอบคลุมสำหรับผู้ใช้ทุกคน
Translator API สามารถทํางานร่วมกับ Language Detector API เพื่อเปิดใช้การตรวจหาภาษาในอุปกรณ์ของผู้ใช้เอง ซึ่งให้ความเป็นส่วนตัวที่ดีกว่าโซลูชันอื่นๆ ที่ต้องอัปโหลดไปยังเซิร์ฟเวอร์ระบบคลาวด์
Summarizer API สามารถใช้สร้างสรุปประเภทต่างๆ ในความยาวและรูปแบบที่หลากหลาย เช่น ประโยค ย่อหน้า รายการหัวข้อย่อย และอื่นๆ เช่น
- สรุปประเด็นสำคัญของบทความหรือการสนทนาทางแชท
- แนะนำชื่อและหัวข้อสำหรับบทความ
- การสร้างข้อมูลสรุปที่กระชับและเป็นประโยชน์ของข้อความที่มีความยาว
- การสร้างตัวอย่างหนังสือโดยอิงจากรีวิวหนังสือ
ฟังก์ชัน CSS
ฟังก์ชัน CSS ที่รวมอยู่ใน Chrome 138 มีฟังก์ชันที่เกี่ยวข้องกับเครื่องหมาย abs() และ sign() ซึ่งจะคํานวณฟังก์ชันต่างๆ ที่เกี่ยวข้องกับเครื่องหมายของอาร์กิวเมนต์
นอกจากนี้ นิพจน์ฟังก์ชัน progress() ที่แสดงผลค่า <number> ซึ่งแสดงตําแหน่งของการคํานวณหนึ่ง (ค่าความคืบหน้า) ระหว่างการคํานวณอีก 2 รายการ (ค่าเริ่มต้นของความคืบหน้าและค่าสิ้นสุดของความคืบหน้า)
สุดท้าย คุณสามารถใช้ฟังก์ชัน sibling-index() และ sibling-count() เป็นจำนวนเต็มในค่าพร็อพเพอร์ตี้ CSS เพื่อจัดรูปแบบองค์ประกอบตามตำแหน่งขององค์ประกอบนั้นๆ เมื่อเทียบกับองค์ประกอบพี่น้อง หรือจำนวนองค์ประกอบพี่น้องทั้งหมดตามลำดับ
Viewport Segments API
Viewport Segments API ช่วยให้คุณกําหนดเป้าหมายอุปกรณ์แบบพับได้ ระบบจะสร้างกลุ่มวิวพอร์ตเมื่อวิวพอร์ตถูกแบ่งโดยฟีเจอร์ฮาร์ดแวร์อย่างน้อย 1 รายการ (เช่น การพับหรือบานพับระหว่างจอแสดงผลแยกต่างหาก) ที่ทำหน้าที่เป็นตัวแบ่ง
ดูข้อมูลเพิ่มเติมได้ที่รองรับอุปกรณ์แบบพับได้ด้วย Viewport Segments API
และอีกมากมาย
แน่นอนว่ายังมีอีกมากมาย
- เมื่อ
<และ>อยู่ในค่าแอตทริบิวต์ ระบบจะหลีกค่าดังกล่าวเมื่อจัดรูปแบบ - ค่าใหม่ 2 ค่า ได้แก่
"prefetchCache"และ"prerenderCache"สำหรับส่วนหัวClear-Site-Dataช่วยให้คุณกําหนดเป้าหมายการล้างแคชการแสดงผลก่อนโหลดและแคชการเรียกข้อมูลล่วงหน้าได้ - คีย์เวิร์ด
stretchสำหรับพร็อพเพอร์ตี้การปรับขนาด CSS (เช่นwidthและheight) ช่วยให้องค์ประกอบขยายขนาดให้เต็มพื้นที่ว่างของบล็อกที่บรรจุไว้ได้