ใหม่ใน Chrome 114

Adriana Jara

สิ่งที่จำเป็นต้องทราบมีดังนี้

  • CSS text-wrap: balance มีไว้เพื่อปรับปรุงเลย์เอาต์ข้อความ
  • คุกกี้ที่แบ่งพาร์ติชันตามเว็บไซต์ระดับบนสุด (CHIPS) จะแสดงที่นี่
  • ป๊อปอัปนั้นง่ายกว่าที่เคยด้วย Popover API
  • นอกจากนี้ยังมีอีกมากมาย

ฉันชื่อ Adriana Jara มาเจาะลึกว่ามีอะไรใหม่สำหรับนักพัฒนาซอฟต์แวร์ใน Chrome 114 กัน

text-wrap:balance

ใช้ text-wrap: balance เพื่อปรับปรุงเลย์เอาต์ข้อความ ภาพเคลื่อนไหวด้านล่างแสดงความแตกต่างที่คุณทำได้ด้วยบรรทัดเดียวนี้

ลองใช้การสาธิต

ในฐานะนักพัฒนาแอป คุณจะไม่ทราบว่าขนาดสุดท้าย ขนาดแบบอักษร หรือแม้แต่ภาษาของข้อความจะเป็นอย่างไร ตัวแปรทั้งหมดจําเป็นสําหรับการจัดการการขึ้นบรรทัดใหม่ของข้อความอย่างมีประสิทธิภาพ เนื่องจากเบราว์เซอร์ทราบปัจจัยทุกอย่าง การใช้ text-wrap:balance คุณจึงขอให้เบราว์เซอร์หาวิธีแก้ปัญหาการตัดบรรทัดได้อย่างสมดุลที่สุดได้

ตัวอย่าง 2 ตัวอย่างก่อนหน้านี้แสดงด้วยกัน ตัวอย่างหนึ่งถูกทําเครื่องหมายว่าไม่สมดุล และอีกตัวอย่างหนึ่งเป็น "สมดุล"

บล็อกข้อความแบบสมดุลจะดึงดูดสายตาของผู้อ่านมากกว่า เนื่องจากดึงดูดความสนใจได้ดีกว่าและอ่านได้ง่ายขึ้นโดยรวม

การสร้างสมดุลระหว่างบรรทัดแรกจะเป็นและควรเป็นกรณีการใช้งานหลักสำหรับ text-wrap: balance การปรับสมดุลข้อความจะมีต้นทุนด้านประสิทธิภาพ ดังนั้นจึงใช้ได้ไม่เกิน 4 บรรทัดเพื่อลดต้นทุน

อ่านบทความนี้ซึ่งมีตัวอย่างและรายละเอียดเพิ่มเติมในการปรับปรุงเลย์เอาต์ข้อความ

CHIPS: Cookies Having Independent Partitioned State

CHIPS (Cookies Having Independent Partitioned State) ช่วยให้คุณเลือกใช้คุกกี้ของบุคคลที่สามที่แบ่งพาร์ติชันโดยเว็บไซต์ระดับบนสุดได้โดยใช้แอตทริบิวต์คุกกี้ใหม่ Partitioned

ก่อน CHIPS เมื่อผู้ใช้เข้าชมเว็บไซต์ ก เว็บไซต์ ค ที่ฝังไว้อาจตั้งค่าคุกกี้ในเครื่องของผู้ใช้ หากผู้ใช้เข้าชมเว็บไซต์ ข. ซึ่งฝังเว็บไซต์ ค. ด้วย เว็บไซต์ ค. จะเข้าถึงคุกกี้เดียวกันกับที่ตั้งไว้ในเว็บไซต์ ก. ได้ ซึ่งช่วยให้เว็บไซต์ ค รวบรวมกิจกรรมการท่องเว็บของผู้ใช้จากเว็บไซต์ ก, ข และทุกเว็บไซต์ที่ฝังไว้ได้

แผนภาพแสดงเว็บไซต์และพื้นที่เก็บข้อมูลที่มีคุกกี้ที่ไม่ได้แบ่งพาร์ติชัน

แม้ว่าการติดตามข้ามเว็บไซต์จะเป็นปัญหา แต่ก็มีความต้องการคุกกี้ข้ามเว็บไซต์ที่ถูกต้องซึ่งสามารถทำได้ในลักษณะที่รักษาความเป็นส่วนตัวด้วยการแบ่งพาร์ติชันคุกกี้

เมื่อใช้ CHIPS เมื่อผู้ใช้เข้าชมเว็บไซต์ ก และเนื้อหาที่ฝังจากเว็บไซต์ ค ตั้งค่าคุกกี้ด้วยแอตทริบิวต์ "แบ่งพาร์ติชัน" ระบบจะบันทึกคุกกี้ไว้ใน Jar ที่แบ่งพาร์ติชันสําหรับคุกกี้ที่เว็บไซต์ ค ตั้งค่าไว้เมื่อฝังในเว็บไซต์ ก เท่านั้น เบราว์เซอร์จะส่งคุกกี้ดังกล่าวเฉพาะเมื่อเว็บไซต์ระดับบนสุดคือ A

แผนภาพแสดงเว็บไซต์และพื้นที่เก็บข้อมูลที่แบ่งพาร์ติชันด้วยคุกกี้

เมื่อผู้ใช้เข้าชมเว็บไซต์ใหม่ เช่น เว็บไซต์ B เว็บไซต์ C จะไม่ได้รับคุกกี้ที่ตั้งค่าไว้เมื่อ C ฝังอยู่ในเว็บไซต์ A

อ่านรายละเอียดเพิ่มเติมเกี่ยวกับกระบวนการเลิกใช้งานคุกกี้ของบุคคลที่สามได้ในบทความนี้

Popover API

Popover API ช่วยให้สร้างองค์ประกอบอินเทอร์เฟซผู้ใช้ (UI) ชั่วคราวที่แสดงอยู่ด้านบน UI ของเว็บแอปอื่นๆ ทั้งหมดได้ง่ายขึ้น

ซึ่งรวมถึงองค์ประกอบที่ผู้ใช้โต้ตอบ เช่น เมนูการทำงาน คำแนะนำองค์ประกอบแบบฟอร์ม เครื่องมือเลือกเนื้อหา และ UI การสอน

แอตทริบิวต์ป๊อปอัปใหม่ช่วยให้องค์ประกอบใดก็ตามแสดงในเลเยอร์บนสุดโดยอัตโนมัติ ซึ่งหมายความว่านักพัฒนาแอปไม่ต้องกังวลเกี่ยวกับการจัดตำแหน่ง การวางซ้อนองค์ประกอบ โฟกัส หรือการโต้ตอบด้วยแป้นพิมพ์อีกต่อไป

องค์ประกอบนี้คล้ายกับองค์ประกอบ <dialog> แต่มีความแตกต่างกันที่สำคัญหลายประการ เช่น ลักษณะการปิดไฟ การจัดการการโต้ตอบของป๊อปอัป และการสนับสนุนเหตุการณ์ รวมถึงไม่มีโหมด "โมดัล"

อ่านข้อมูลเพิ่มเติมได้ในบทความนี้

และอีกมากมาย

แถมยังมีอีกมากมาย

  • เครื่องมือสำหรับนักพัฒนาซอฟต์แวร์ช่วยให้คุณหยุดชั่วคราวและแก้ไขข้อบกพร่องโค้ด C และ C++ ในแอป WebAssembly ด้วยการรองรับ DWARF
  • ตัวเลือก exclusionFilters ใน navigator.bluetooth.requestDevice() ช่วยให้นักพัฒนาเว็บยกเว้นอุปกรณ์บางรุ่นจากเครื่องมือเลือกเบราว์เซอร์ได้
  • มีช่วงทดลองใช้การเบลอพื้นหลังจากต้นทาง

อ่านเพิ่มเติม

ข้อมูลนี้เป็นเพียงไฮไลต์สำคัญบางส่วนเท่านั้น ดูการเปลี่ยนแปลงเพิ่มเติมใน Chrome 114 ได้ที่ลิงก์ด้านล่าง

สมัครใช้บริการ

หากต้องการติดตามข่าวสารล่าสุด โปรดติดตามช่อง YouTube ของนักพัฒนาซอฟต์แวร์ Chrome แล้วคุณจะได้รับอีเมลแจ้งเตือนทุกครั้งที่เราเปิดตัววิดีโอใหม่

ฉันชื่อ Adriana Jara และพร้อมที่จะมาบอกคุณถึงสิ่งใหม่ๆ ใน Chrome ทันทีที่ Chrome 115 เปิดตัว