เส้นทางการเคลื่อนไหว CSS, Back/Forward Cache NotRestoredreason API, Document Picture-in-Picture และอื่นๆ
การเปลี่ยนแปลงที่อธิบายจะมีผลกับ Chrome เวอร์ชันเบต้ารุ่นล่าสุดสำหรับ Android, ChromeOS, Linux, macOS และ Windows เว้นแต่จะระบุไว้เป็นอย่างอื่น ดูข้อมูลเพิ่มเติมเกี่ยวกับฟีเจอร์ต่างๆ ที่ระบุไว้ที่นี่ผ่านลิงก์ที่ให้ไว้หรือจากรายการใน ChromeStatus.com โดย Chrome 116 เป็นรุ่นเบต้าเมื่อวันที่ 19 กรกฎาคม 2023 คุณสามารถดาวน์โหลดเวอร์ชันล่าสุดได้ที่ Google.com สำหรับเดสก์ท็อปหรือ Google Play Store บน Android
CSS
รุ่นนี้ได้เพิ่มฟีเจอร์ CSS ใหม่ 2 รายการ
เส้นทางการเคลื่อนไหว 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 รองรับโปรแกรมอ่าน Take-your-Buffer (BYOB) สำหรับสตรีมแบบไบต์ที่อ่านได้ ตอนนี้ Response.body เป็นสตรีมแบบไบต์ที่อ่านได้ แทนที่จะเป็นสตรีมที่อ่านได้ "เริ่มต้น" ทำให้สามารถใช้ Fetch API กับเครื่องอ่าน BYOB เพื่อช่วยลดค่าใช้จ่ายและสําเนาการเก็บรวบรวมขยะ และปรับปรุงการตอบสนองสําหรับผู้ใช้ ตอนนี้ Blob.stream() ยังได้ประโยชน์จากการเพิ่มประสิทธิภาพนี้อีกด้วย
Back-Forward Cache NotRestoredWhy API
NotRestoredreason API จะรายงานรายการเหตุผลที่หน้าเว็บไม่แสดงจาก BFcache ในโครงสร้างแผนผังเฟรมผ่าน PerformanceNavigationTiming API
การแสดงภาพซ้อนภาพของเอกสาร
เอกสารการแสดงภาพซ้อนภาพจะเพิ่ม API ใหม่เพื่อเปิดหน้าต่างด้านบนตลอดเวลาซึ่งสามารถป้อนข้อมูล HTMLElements ที่กำหนดเองได้ นี่เป็นการขยายจาก HTMLVideoElement API ที่มีอยู่ซึ่งอนุญาตให้ใส่ HTMLVideoElement ในหน้าต่างการแสดงภาพซ้อนภาพ (PIP) เท่านั้น วิธีนี้ช่วยให้นักพัฒนาเว็บมอบประสบการณ์การใช้งาน PIP ที่ดียิ่งขึ้นแก่ผู้ใช้ได้
ขยายไวลด์การ์ดในต้นทางนโยบายสิทธิ์
ไวลด์การ์ดโดเมนย่อยในรายการที่อนุญาตให้ความยืดหยุ่นบางอย่างที่มีประโยชน์ แต่ต่างจากโปรแกรมแยกวิเคราะห์ไวลด์การ์ดที่มีอยู่และจำเป็นต้องใช้โค้ดแบบใหม่และข้อกำหนด ซึ่ง Intent นี้จะลดค่าใช้จ่ายดังกล่าวด้วยการนำบางส่วนของข้อกำหนดของนโยบายรักษาความปลอดภัยเนื้อหาที่มีอยู่มาใช้ซ้ำ รวมถึงอนุญาต scheme + wildcard domain และ wildcard port ในรายการที่อนุญาต กล่าวโดยเจาะจงก็คือ Intent นี้จะใช้คำจำกัดความของแหล่งที่มาของโฮสต์และ Scheme-source แทนต้นทางในคำจำกัดความของรายการที่อนุญาต ขณะที่กำหนดให้ส่วนเส้นทางว่างเปล่า (เนื่องจากนโยบายสิทธิ์มีผลกับต้นทางที่ตรงกัน)
แพ็กเกจ FedCM: API คำแนะนำการเข้าสู่ระบบ, User Info API และ API บริบท RP
การอัปเดตชุดนี้ทำให้สามารถปรับแต่งขั้นตอนการเข้าสู่ระบบแบบรวมศูนย์ซึ่งใช้ Federated Credential Management API (FedCM)
เมื่อใช้ API คำแนะนำการเข้าสู่ระบบ บุคคลที่เกี่ยวข้อง (RP) จะระบุคำแนะนำเกี่ยวกับบัญชีผู้ใช้ที่ต้องการให้แสดงใน UI ของ FedCM ได้ ซึ่งโดยหลักจะใช้เพื่อมอบ UX ที่ดีขึ้นสำหรับผู้ใช้ที่กลับมา
User Data API ช่วยให้ผู้ให้บริการข้อมูลประจำตัว (IdP) ดึงข้อมูลผู้ใช้เพื่อปรับเปลี่ยนประสบการณ์การเข้าสู่ระบบให้เหมาะกับผู้ใช้ที่กลับมาได้ เช่น ผ่านปุ่ม "ลงชื่อเข้าใช้ด้วย IdP" ที่ปรับเปลี่ยนในแบบของคุณ
เมื่อใช้ API บริบทของ RP RP สามารถขอให้กล่องโต้ตอบ FedCM แทนที่ชื่อ "ลงชื่อเข้าใช้" ด้วย "ลงชื่อสมัครใช้" "ใช้" หรือ "ต่อไป" เพื่อปรับความตั้งใจที่แท้จริงให้กับผู้ใช้
เหตุการณ์การเข้า/ออกจากเมาส์และตัวชี้ที่ไม่เขียน
ทำให้พร็อพเพอร์ตี้ event.composed ในเหตุการณ์ mouseenter, mouseleave, pointerenter และ pointerleave "false" เป็นไปตามข้อกำหนดและเพื่อแก้ไขข้อบกพร่องของการทำงานร่วมกัน ทั้งข้อมูลจำเพาะเหตุการณ์ UI สำหรับเหตุการณ์เมาส์และข้อมูลจำเพาะเหตุการณ์ของตัวชี้กำหนดเหตุการณ์เหล่านี้เป็นแบบไม่เขียน ข้อมูลจำเพาะทั้ง 2 แบบไม่ได้เปลี่ยนแปลงไปจากคำจำกัดความเดิมเมื่อ 2-3 ปีที่แล้ว: https://github.com/w3c/uievents/pull/210 https://github.com/w3c/pointerevents/pull/461 นอกจากการแก้ไขช่องว่างของการทำงานร่วมกันแล้ว การเปลี่ยนแปลงนี้ยังแก้ไขการส่งเหตุการณ์เหล่านี้ซ้ำหรือสามครั้งที่ผิดพลาดไปยังโฮสต์ DOM ใน Chromium ด้วยเมื่อฟังเงาของ DOM
นําการรับช่วงแซนด์บ็อกซ์ 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 ใช้เพื่อแบ่งความสัมพันธ์ระหว่างป๊อปอัปกับโปรแกรมเปิดเพื่อเพิ่มความปลอดภัย "restrict-properties" เป็นค่าที่เสนอที่จำกัดความสัมพันธ์แทนที่จะแยกออกจากกันโดยสิ้นเชิง จะเปิดใช้ CrossOriginIsolated เมื่อจับคู่กับ COEP
ลงทะเบียนทดลองใช้ต้นทางการจำกัดพร็อพเพอร์ตี้ COOP
API สถานะการลงชื่อเข้าใช้ FedCM
API สถานะการลงชื่อเข้าใช้ IdP ของ Federated Credential Management API (FedCM) ช่วยให้ผู้ให้บริการข้อมูลประจำตัว (IdP) ส่งสัญญาณไปยังเบราว์เซอร์เมื่อผู้ใช้ลงชื่อเข้าสู่ระบบ/ออกจากระบบ เพื่อให้ FedCM เพิ่มคุณสมบัติความเป็นส่วนตัวของตนด้วยการเพิ่มประสิทธิภาพ UX
ลงทะเบียนทดลองใช้สถานะการลงชื่อเข้าใช้ FedCM จากต้นทาง
API ของ EditContext
EditContext API จะลดความซับซ้อนของกระบวนการผสานรวมเว็บแอปเข้ากับวิธีการป้อนข้อความขั้นสูง เช่น การเขียนรูปร่าง VK, แผงลายมือ การรู้จำคำพูด และองค์ประกอบ IME API ช่วยปรับปรุงการช่วยเหลือพิเศษและประสิทธิภาพ รวมทั้งปลดล็อกความสามารถใหม่ๆ สำหรับเครื่องมือแก้ไขบนเว็บ
ลงทะเบียนทดลองใช้ EditContext API จากต้นทาง
ระยะเวลาของเฟรมภาพเคลื่อนไหวยาว
นี่คือการขยายงานที่ใช้เวลานาน โดยจะวัดงานควบคู่กับการอัปเดตการแสดงผลที่ตามมา โดยการเพิ่มข้อมูล เช่น สคริปต์ที่ใช้เวลานาน เวลาในการแสดงผล และเวลาที่ใช้ในการบังคับใช้เลย์เอาต์และสไตล์ ซึ่งเรียกว่าการควบคุมเลย์เอาต์
นักพัฒนาแอปสามารถใช้รายงานนี้เป็นการวินิจฉัย "ความช้า" ซึ่งวัดโดย INP โดยค้นหาสาเหตุของความหนาแน่นของเทรดหลักซึ่งมักเป็นสาเหตุที่ทําให้ INP ไม่ดี