เส้นทางการเคลื่อนไหว CSS, Back/Forward Cache NotRestoredReason API, การแสดงภาพซ้อนภาพเอกสาร และอื่นๆ
การเปลี่ยนแปลงต่างๆ ที่ได้อธิบายไว้จะมีผลกับ Chrome เวอร์ชันเบต้าใหม่ล่าสุดสำหรับ Android, ChromeOS, Linux, macOS และ Windows ยกเว้นกรณีที่ระบุไว้เป็นอย่างอื่น เรียนรู้เพิ่มเติมเกี่ยวกับฟีเจอร์ที่แสดงรายการไว้ที่นี่ผ่านลิงก์ที่ให้ไว้หรือจากรายการใน ChromeStatus.com Chrome 116 เป็นเวอร์ชันเบต้าตั้งแต่วันที่ 19 กรกฎาคม 2023 เป็นต้นไป คุณดาวน์โหลดเวอร์ชันล่าสุดได้จาก Google.com สำหรับเดสก์ท็อปหรือ Google Play Store ใน Android
CSS
รุ่นนี้เพิ่มฟีเจอร์ใหม่ 2 รายการ CSS
เส้นทางการเคลื่อนไหว CSS
เส้นทางการเคลื่อนไหวช่วยให้ผู้เขียนวางตำแหน่งวัตถุกราฟิกใดก็ได้และทำให้วัตถุนั้นเคลื่อนไหวไปตามเส้นทางที่นักพัฒนาซอฟต์แวร์ระบุไว้ วิธีนี้จะทำให้สามารถเปลี่ยนรูปแบบใหม่ๆ ได้อย่างมีประสิทธิภาพ เช่น การหาตำแหน่งโดยใช้พิกัดเชิงขั้ว (ด้วยฟังก์ชัน ray()) แทนที่จะใช้พิกัดสี่เหลี่ยมผืนผ้ามาตรฐานที่ฟังก์ชัน translate() ใช้ หรือการทำให้องค์ประกอบเคลื่อนไหวไปตามเส้นทางที่กำหนด ซึ่งช่วยให้กำหนดการเปลี่ยนภาพแบบ 2 มิติที่ซับซ้อนและสวยงามได้ง่ายขึ้น เส้นทางสามารถระบุเป็น circle(), ellipse(), rect(), inset(), xywh(), polygon(), ray() และ url()
ภาพเคลื่อนไหวของการแสดงผลและระดับการเข้าถึงเนื้อหา
Chrome 116 รองรับคุณสมบัติ display และ content-visibility ในภาพเคลื่อนไหวของคีย์เฟรม การรองรับนี้จะอนุญาตให้นักพัฒนาซอฟต์แวร์สร้างภาพเคลื่อนไหวออกหลังจากที่องค์ประกอบกลายเป็น display: none หรือ content-visibility: hidden โดยอัตโนมัติโดยไม่ต้องเขียน JavaScript เพื่อจัดการสวิตช์นั้นหลังจากที่ภาพเคลื่อนไหวเสร็จแล้ว ซึ่งจะช่วยให้เพิ่มองค์ประกอบใน CSS ได้เพียงอย่างเดียว
API ของเว็บ
AbortSignal.any()
แสดงผลสัญญาณที่ล้มเลิกเมื่อมีการล้มเลิกสัญญาณต้นทางใดๆ นักพัฒนาแอปสามารถใช้การตั้งค่านี้เพื่อรวมแหล่งที่มาของการยกเลิกอิสระ เช่น ระยะหมดเวลาที่ระบุด้วย AbortSignal.timeout() และสัญญาณที่เชื่อมโยงกับ AbortController และส่งไปยัง API ที่ไม่พร้อมกัน เช่น fetch()
การสนับสนุน BYOB สำหรับการดึงข้อมูล
การใช้งาน ReadableStream ของ Chrome รองรับโปรแกรมอ่านบัฟเฟอร์ของคุณเอง (BYOB) สำหรับสตรีมไบต์ที่อ่านได้ ตอนนี้ Response.body จะเป็นไบต์สตรีมที่อ่านได้แทน "ค่าเริ่มต้น" ด้วย ที่อ่านได้ วิธีนี้ช่วยให้สามารถใช้ Fetch API กับเครื่องอ่าน BYOB ได้ ช่วยลดโอเวอร์เฮดและการคัดลอกเกี่ยวกับขยะ รวมถึงปรับปรุงการตอบสนองสำหรับผู้ใช้ ตอนนี้ Blob.stream() ก็ได้รับประโยชน์จากการเพิ่มประสิทธิภาพนี้ด้วย
Back-Forward Cache NotRestoredReason API
NotRestoredReason API จะรายงานรายการเหตุผลที่หน้าเว็บไม่แสดงจาก BFcache ในโครงสร้างเฟรมแบบต้นไม้ผ่าน PerformancenavigationTiming API
การแสดงภาพซ้อนภาพในเอกสาร
การแสดงภาพซ้อนภาพในเอกสารเพิ่ม API ใหม่เพื่อเปิดหน้าต่างแบบเปิดด้านบนตลอดเวลาซึ่งจะป้อนข้อมูลด้วย HTMLElements ที่กําหนดเองได้ ซึ่งเป็นการขยายจาก HTMLVideoElement API ที่มีอยู่ซึ่งอนุญาตให้ใส่ HTMLVideoElement ในหน้าต่างการแสดงภาพซ้อนภาพ (PIP) เท่านั้น วิธีนี้ช่วยให้นักพัฒนาเว็บมอบประสบการณ์ PIP ที่ดีขึ้นให้แก่ผู้ใช้ได้
ไวลด์การ์ดที่ขยายในต้นทางนโยบายสิทธิ์
ไวลด์การ์ดโดเมนย่อยในรายการที่อนุญาตให้ความยืดหยุ่นบางอย่างที่มีคุณค่า แต่จะต่างจากโปรแกรมแยกวิเคราะห์ไวลด์การ์ดที่มีอยู่ รวมถึงโค้ดใหม่ๆ และข้อมูลจำเพาะที่จำเป็น ซึ่งจะช่วยลดค่าใช้จ่ายในการดำเนินการดังกล่าวลงโดยการนำบางส่วนของข้อกำหนดของนโยบายรักษาความปลอดภัยเนื้อหาที่มีอยู่มาใช้ซ้ำและอนุญาตให้ scheme + wildcard domain และ wildcard port อยู่ในรายการที่อนุญาต กล่าวอย่างเจาะจงคือ Intent นี้จะใช้คำจำกัดความของแหล่งที่มาของโฮสต์และแหล่งที่มาของรูปแบบแทนต้นทางในคำจำกัดความของรายการที่อนุญาต ขณะที่กำหนดให้ส่วนเส้นทางว่างเปล่า (เนื่องจากนโยบายสิทธิ์ใช้กับต้นทางที่ตรงกัน)
แพ็กเกจ FedCM: API คำแนะนำการเข้าสู่ระบบ, API ข้อมูลผู้ใช้และ API บริบทของ RP
การอัปเดตแบบกลุ่มนี้ช่วยให้ปรับแต่งขั้นตอนการเข้าสู่ระบบแบบรวมศูนย์ที่ใช้ Federated Credential Management API (FedCM) ได้
เมื่อใช้ API คำแนะนำการเข้าสู่ระบบ ฝ่ายที่เกี่ยวข้อง (RP) สามารถระบุคำแนะนำเกี่ยวกับบัญชีผู้ใช้ที่ต้องการให้แสดงใน UI ของ FedCM ส่วนนี้มีไว้เพื่อให้ UX ที่ดีขึ้นสำหรับผู้ใช้ที่กลับมา
User Info API ช่วยให้ผู้ให้บริการข้อมูลประจำตัว (IdP) ดึงข้อมูลผู้ใช้เพื่อปรับเปลี่ยนประสบการณ์การเข้าสู่ระบบให้เหมาะกับผู้ใช้ที่กลับมาได้ เช่น ผ่านปุ่ม "ลงชื่อเข้าใช้ด้วย IdP" ที่ปรับเปลี่ยนในแบบของคุณ
เมื่อใช้ RP Context API ผู้เล่นสามารถขอกล่องโต้ตอบ FedCM เพื่อแทนที่ชื่อ "ลงชื่อเข้าใช้" ได้ ด้วย "ลงชื่อสมัครใช้" "ใช้" หรือ "ต่อไป" เพื่อปรับความตั้งใจที่แท้จริงให้กับผู้ใช้
เหตุการณ์การป้อน/ออกจากเมาส์และตัวชี้ที่ไม่ได้เขียน
ทำให้พร็อพเพอร์ตี้ event.composed ในเหตุการณ์ mouseenter, mouseleave, pointerenter และ pointerleave "false" เป็นไปตามข้อกำหนดและแก้ไขช่องว่างของการทำงานร่วมกัน ทั้งข้อกำหนดของเหตุการณ์ UI สำหรับเหตุการณ์ของเมาส์และข้อกำหนดเหตุการณ์ของตัวชี้กำหนดเหตุการณ์เหล่านี้ว่าเป็นเหตุการณ์ที่ไม่ได้เขียนขึ้น ข้อกำหนดทั้งสองได้เปลี่ยนจากคำจำกัดความเดิมเมื่อ 2-3 ปีก่อน: https://github.com/w3c/uievents/pull/210 https://github.com/w3c/pointerevents/pull/461 นอกเหนือจากการแก้ไขช่องว่างของการทำงานร่วมกันแล้ว การเปลี่ยนแปลงนี้ยังแก้ไขการจ่ายเหตุการณ์ Shadow DOM แบบ 2 หรือ 3 ครั้งที่ผิดพลาดไปยังโฮสต์เหตุการณ์ Shadow ใน Chromium ด้วย
นำการสืบทอดแซนด์บ็อกซ์ของ document.open ออก
ขณะนี้มีการใช้แฟล็กแซนด์บ็อกซ์ของผู้โทรกับผู้โทรรายนั้นเมื่อ document.open กำหนดเป้าหมายไปยังหน้าต่างอื่น การเปลี่ยนแปลงดังกล่าวจะไม่เกิดขึ้นหลังจากการเปลี่ยนแปลงนี้..
รายงาน Critical-CH ทำให้รีสตาร์ทใน NavigationTiming
เว็บไซต์สามารถระบุได้ว่าคำแนะนำไคลเอ็นต์หนึ่งๆ มีความสำคัญต่อหน้าเว็บโดยการรวมคำแนะนำไว้ในส่วนหัวการตอบกลับ HTTP ของ Critical-CH การดำเนินการนี้จะทริกเกอร์การเชื่อมต่อใหม่หากคำแนะนำที่แสดงในส่วนหัวการตอบกลับ HTTP ของ Critical-CH อาจ (แต่ไม่ได้) รวมอยู่ในคำขอ HTTP ที่ส่งในตอนแรก Intent นี้เสนอให้เพิ่ม readonly attribute DOMHighResTimeStamp criticalCHRestart; ในอินเทอร์เฟซ PerformanceNavigationTiming
ช่วงทดลองใช้จากต้นทางอยู่ระหว่างดำเนินการ
ใน Chrome 116 คุณสามารถเลือกใช้การทดลองใช้ต้นทางใหม่ดังต่อไปนี้
COOP: จำกัดที่พัก
Cross-Origin-Opener-Policy ใช้เพื่อตัดความสัมพันธ์ระหว่างป๊อปอัปกับ Opener เพื่อเพิ่มความปลอดภัย "restrict-properties" เป็นค่าที่เสนอซึ่งจำกัดความสัมพันธ์แทนที่จะแยกออกจากกันโดยสมบูรณ์ ซึ่งจะเปิดใช้ CrossOriginIsolated เมื่อจับคู่กับ COEP
ลงทะเบียนเพื่อทดลองใช้ต้นทางแบบจำกัด COOP
API สถานะการลงชื่อเข้าใช้ของ FedCM
API สถานะการลงชื่อเข้าใช้ IdP ของ API การจัดการข้อมูลเข้าสู่ระบบแบบรวมศูนย์ (Federated Credential Management API หรือ FedCM) ช่วยให้ผู้ให้บริการข้อมูลประจำตัว (IdP) ส่งสัญญาณไปยังเบราว์เซอร์เมื่อผู้ใช้เข้าสู่ระบบ/ออกจากระบบ เพื่อให้ FedCM ยกระดับคุณสมบัติด้านความเป็นส่วนตัวโดยเพิ่มประสิทธิภาพ UX ได้
ลงทะเบียนเพื่อทดลองใช้สถานะการลงชื่อเข้าใช้ของ FedCM จากต้นทาง
EditContext API
EditContext API ช่วยลดความซับซ้อนในการผสานรวมเว็บแอปกับวิธีการป้อนข้อความขั้นสูง เช่น การเขียนรูปร่าง VK, แผงการเขียนด้วยลายมือ, การจดจำคำพูด และองค์ประกอบ IME API นี้จะช่วยปรับปรุงการช่วยเหลือพิเศษและประสิทธิภาพ รวมทั้งปลดล็อกความสามารถใหม่ๆ สำหรับเครื่องมือแก้ไขบนเว็บ
ลงทะเบียนช่วงทดลองใช้ EditContext API จากต้นทาง
การจับเวลาเฟรมของภาพเคลื่อนไหวที่ใช้เวลานาน
ซึ่งเป็นส่วนขยายของงานที่ใช้เวลานาน โดยจะวัดงานพร้อมกับการอัปเดตการแสดงผลครั้งต่อๆ ไป โดยเพิ่มข้อมูล เช่น สคริปต์ที่ทํางานเป็นเวลานาน เวลาในการแสดงผล และเวลาที่ใช้ในการจัดรูปแบบและสไตล์ที่บังคับ หรือที่เรียกว่าการเพิ่มประสิทธิภาพเลย์เอาต์
นักพัฒนาแอปสามารถใช้ค่านี้เพื่อวินิจฉัย "ความช้า" ซึ่งวัดโดย INP โดยการค้นหาสาเหตุของความคับคั่งของชุดข้อความหลักซึ่งมักเป็นสาเหตุของ INP ที่ไม่ดี
ลงทะเบียนเพื่อทดลองใช้ Long Animation Frame Timing จากต้นทาง