การเปลี่ยนแปลงต่อไปนี้มีผลกับ Chrome เบต้าเวอร์ชันล่าสุดในช่องทางสำหรับ Android, ChromeOS, Linux, macOS และ Windows เว้นแต่จะระบุไว้เป็นอย่างอื่น ดูข้อมูลเพิ่มเติมเกี่ยวกับฟีเจอร์ที่แสดงที่นี่ผ่านลิงก์ที่ให้ไว้หรือจากรายการใน ChromeStatus.com Chrome 123 เป็นเวอร์ชันเบต้าตั้งแต่วันที่ 21 กุมภาพันธ์ 2024 คุณสามารถดาวน์โหลดเวอร์ชันล่าสุดได้ที่ Google.com สำหรับเดสก์ท็อป หรือใน Google Play Store บน Android
CSS
รุ่นนี้มีการเพิ่มฟีเจอร์ CSS ใหม่ 5 รายการ
ฟังก์ชันสี light-dark()
ของ CSS
ฟังก์ชัน light-dark()
ใน CSS ช่วยให้นักพัฒนาซอฟต์แวร์ปรับรูปแบบสีให้เหมาะกับค่ากำหนดของผู้ใช้สำหรับโหมดสว่างหรือโหมดมืดได้ง่ายขึ้น
ใช้ light-dark()
เพื่อระบุค่าสี 2 ค่าที่แตกต่างกันภายในพร็อพเพอร์ตี้ CSS รายการเดียว เบราว์เซอร์ (หรืออุปกรณ์) จะเลือกสีที่เหมาะสมโดยอัตโนมัติตามค่า color-scheme
ที่คำนวณแล้วขององค์ประกอบ เช่น ใช้ CSS ต่อไปนี้
- หากผู้ใช้เลือกธีมสว่าง องค์ประกอบ
.target
จะมีพื้นหลังสีเขียวมะนาว - หากผู้ใช้เลือกธีมมืด องค์ประกอบ
.target
จะมีพื้นหลังสีเขียว
html {
color-scheme: light dark;
}
.target {
background-color: light-dark(lime, green);
}
โหมดการแสดงภาพซ้อนภาพ CSS
เพิ่มการรองรับฟีเจอร์สื่อ CSS display-mode
สำหรับค่า picture-in-picture
ซึ่งช่วยให้นักพัฒนาเว็บเขียนกฎ CSS ที่เฉพาะเจาะจงซึ่งจะใช้ก็ต่อเมื่อเว็บแอป (บางส่วน) แสดงในโหมดภาพซ้อนภาพเท่านั้น
ดูข้อมูลเพิ่มเติมเกี่ยวกับฟีเจอร์สื่อนี้ในเอกสารประกอบเกี่ยวกับฟีเจอร์ภาพซ้อนภาพ
พร็อพเพอร์ตี้ CSS align-content สำหรับบล็อก
ตอนนี้ระบบรองรับพร็อพเพอร์ตี้ align-content
CSS ในคอนเทนเนอร์บล็อกและเซลล์ตารางแล้ว ก่อนหน้านี้ พร็อพเพอร์ตี้นี้ใช้ได้กับรายการตารางกริดและรายการ Flex เท่านั้น ตัวอย่างเช่น ตอนนี้คุณจัดแนว display: block
, display: list-item
และ display: table-cell
โดยใช้ align-content
ได้แล้ว
ดูข้อมูลเพิ่มเติมในการรองรับ align-content
ในเลย์เอาต์บล็อกและตาราง
พร็อพเพอร์ตี้ CSS field-sizing
เมื่อใช้พร็อพเพอร์ตี้ field-sizing
นักพัฒนาแอปสามารถปิดใช้ขนาดเริ่มต้นแบบคงที่ของตัวควบคุมแบบฟอร์ม และกำหนดให้ขนาดของตัวควบคุมขึ้นอยู่กับเนื้อหา ซึ่งจะเป็นวิธีสร้างช่องข้อความที่ขยายขนาดโดยอัตโนมัติ
พร็อพเพอร์ตี้ CSS text-spacing-trim
พร็อพเพอร์ตี้นี้จะใช้การแยกอักขระแบบตัวคู่กับอักขระเครื่องหมายวรรคตอนของภาษาจีน ญี่ปุ่น และเกาหลี (CJK) เพื่อให้ได้แบบอักษรที่ดูน่าดึงดูดตามที่ระบุไว้ใน JLREQ (ข้อกำหนดสำหรับเลย์เอาต์ข้อความภาษาญี่ปุ่น) และ CLREQ (ข้อกำหนดสำหรับเลย์เอาต์ข้อความจีน)
อักขระเครื่องหมายวรรคตอน CJK จำนวนมากมีการเว้นวรรคภายในอักขระ เช่น จุดสิ้นสุด CJK และวงเล็บปิด CJK มักจะมีการเว้นวรรคภายในอักขระในส่วนครึ่งขวาของช่องว่างอักขระ เพื่อให้อักขระเหล่านี้อยู่ข้างหน้าเสมอเช่นเดียวกับอักขระรูปอักษรอื่นๆ แต่เมื่อปรากฏเป็นแถว ระยะห่างภายในอักขระจะมากเกินไป ฟีเจอร์นี้จะปรับการเว้นวรรคที่มากเกินไปดังกล่าว
พร็อพเพอร์ตี้ text-spacing-trim
ยอมรับค่าใดค่าหนึ่งต่อไปนี้
normal
, trim-start
, space-all
และ space-first
ดูข้อมูลเพิ่มเติมได้ที่ขอแนะนําฟีเจอร์ใหม่ 4 รายการใน CSS สำหรับผู้ใช้ต่างประเทศ
Web API
อนุญาตให้สร้างข้อมูลเข้าสู่ระบบ WebAuthn ใน iframe แบบข้ามต้นทาง
ฟีเจอร์นี้ช่วยให้นักพัฒนาเว็บสร้างข้อมูลเข้าสู่ระบบ WebAuthn (นั่นคือข้อมูลเข้าสู่ระบบ "publickey" หรือที่เรียกว่าพาสคีย์) ใน iframe ข้ามต้นทางได้ ความสามารถใหม่นี้ต้องมี 2 เงื่อนไขดังนี้
- iframe มีนโยบายสิทธิ์
publickey-credentials-create-feature
- iframe มีการเปิดใช้งานผู้ใช้ชั่วคราว
ซึ่งจะช่วยให้นักพัฒนาแอปสร้างพาสคีย์ในสถานการณ์ที่ฝังอยู่ได้ เช่น หลังจากที่ทำตามขั้นตอนการเพิ่มความปลอดภัยของข้อมูลประจำตัวแล้ว โดยที่ฝ่ายที่ใช้ข้อมูลให้กำลังให้บริการประสบการณ์ข้อมูลประจำตัวแบบรวมศูนย์
กลุ่มฟีเจอร์การรายงานการระบุแหล่งที่มา
Chrome 123 เพิ่มการปรับแต่งข้อมูลทริกเกอร์และตัวกรองค่าที่รวบรวมได้ลงใน Attribution Reporting API โดยมุ่งเน้นที่สิ่งต่อไปนี้
- ความสามารถในการกําหนดค่า API เพิ่มเติมสําหรับการรายงานระดับเหตุการณ์โดยรองรับการปรับแต่ง Cardinality และค่าของข้อมูลทริกเกอร์
- ความสามารถในการกําหนดค่า API เพิ่มเติมสําหรับรายงานสรุปโดยรองรับตัวกรองในค่าที่รวบรวมได้
การวัดการระบุแหล่งที่มาแบบข้ามแอปและเว็บ
ขยาย Attribution Reporting API เพื่ออนุญาตให้ระบุแหล่งที่มาของ Conversion ที่เกิดขึ้นบนเว็บเป็นเหตุการณ์ที่เกิดขึ้นนอกเบราว์เซอร์ภายในแอปพลิเคชันอื่นๆ
ข้อเสนอนี้ใช้ประโยชน์จากการสนับสนุนการระบุแหล่งที่มาในระดับระบบปฏิบัติการ โดยเฉพาะอย่างยิ่ง ตัวเลือกนี้จะช่วยให้นักพัฒนาแอปสามารถอนุญาตให้เหตุการณ์ในเว็บบนอุปกรณ์เคลื่อนที่เข้าร่วมกับเหตุการณ์ใน Privacy Sandbox ของ Android ได้ แม้ว่าจะรองรับแพลตฟอร์มอื่นๆ ได้ด้วยก็ตาม
blocking=render
ในสคริปต์โมดูลในบรรทัด
การเปลี่ยนแปลงเล็กๆ นี้จะนำข้อจำกัดที่ไม่จำเป็นออกจาก<script blocking="render">
ก่อนหน้านี้ <script blocking="render"type="module">
ต้องใช้แอตทริบิวต์ src
แม้ว่า src
นี้จะต้องเป็น URI ของข้อมูลก็ตาม
ข้อจำกัดนี้ไม่จำเป็น เนื่องจากสคริปต์โมดูลในบรรทัดที่นำสคริปต์อื่นๆ เข้ามาควรยังคงแสดงผลบล็อกได้
เหตุผลคือการเปลี่ยนมุมมองข้ามเอกสารมักใช้สคริปต์ที่บล็อกการแสดงผลเพื่อการปรับแต่ง ดังนั้นการทำให้สคริปต์ที่บล็อกการแสดงผลเขียนได้ง่ายขึ้นจะช่วยรองรับฟีเจอร์นี้
ภาพซ้อนภาพในเอกสาร: อนุญาตให้ focus()
API โฟกัสที่โปรแกรมเปิด
ตอนนี้คุณใช้ opener.focus()
จากหน้าต่างภาพซ้อนภาพในเอกสารเพื่อโฟกัสระดับระบบไปยังแท็บที่เป็นเจ้าของหน้าต่างภาพซ้อนภาพในเอกสารได้แล้ว
ซึ่งช่วยให้นักพัฒนาแอปนำแท็บเดิมกลับมาอยู่เบื้องหน้าได้เมื่อจำเป็น เช่น เมื่อผู้ใช้ต้องการเข้าถึงประสบการณ์ UI ที่พอดีกับหน้าต่างภาพในภาพขนาดเล็กไม่ได้
ไวยากรณ์แอตทริบิวต์การนําเข้า with
แอตทริบิวต์การนําเข้าเป็นฟีเจอร์ JavaScript ที่อนุญาตให้กำกับเนื้อหาประกาศการนําเข้า เช่น import xxx from "mod" with { type: "json" }
เดิมที Chrome เปิดตัวข้อเสนอเวอร์ชันก่อนหน้า (ใน Chrome 91) โดยใช้ assert
เป็นคีย์เวิร์ด จากนั้นเวอร์ชันนี้ได้รับการอัปเดตให้ใช้ with
เนื่องจากต้องมีการทำการเปลี่ยนแปลงบางอย่างขณะผสานรวมกับโมดูล HTML สำหรับ JSON และ CSS
jitterBufferTarget
แอตทริบิวต์ jitterBufferTarget
ช่วยให้แอปพลิเคชันระบุระยะเวลาเป้าหมายเป็นมิลลิวินาทีของสื่อที่บัฟเฟอร์การกระโดดของ RTCRtpReceiver
จะเก็บไว้ได้ ซึ่งส่งผลต่อจำนวนการบัฟเฟอร์ที่ User Agent ดำเนินการ ซึ่งส่งผลต่อการส่งอีกครั้งและการกู้คืนแพ็กเก็ตที่สูญหาย การเปลี่ยนแปลงค่าเป้าหมายช่วยให้แอปพลิเคชันควบคุมการแลกเปลี่ยนระหว่างความล่าช้าในการเล่นและความเสี่ยงที่จะใช้เฟรมเสียงหรือวิดีโอจนหมดเนื่องจากความผันผวนของเครือข่าย
ช่วงเวลาของเฟรมภาพเคลื่อนไหวที่ใช้เวลานาน
Long Animation Frames API เป็นส่วนขยายของ Long Tasks API โดยจะวัดงานพร้อมกับการอัปเดตการแสดงผลในภายหลัง เพิ่มข้อมูล เช่น สคริปต์ที่ทำงานเป็นเวลานาน เวลาในการเรนเดอร์ และเวลาที่ใช้กับเลย์เอาต์และสไตล์ที่บังคับ ซึ่งเรียกว่าการบังคับใช้เลย์เอาต์
นักพัฒนาซอฟต์แวร์สามารถใช้ข้อมูลนี้เพื่อวินิจฉัย "ความล่าช้า" ซึ่งวัดโดย INP โดยค้นหาสาเหตุของความแออัดของชุดข้อความหลัก ซึ่งมักเป็นสาเหตุของ INP ที่ไม่ถูกต้อง
NavigationActivation
อินเทอร์เฟซ NavigationActivation จะเพิ่ม navigation.activation
ข้อมูลนี้จัดเก็บสถานะเกี่ยวกับเวลาที่เปิดใช้งานเอกสารปัจจุบัน (เช่น เมื่อมีการเริ่มต้นเอกสาร หรือกู้คืนจากแคชย้อนกลับ/ไปข้างหน้า)
ซึ่งหมายความว่านักพัฒนาแอปสามารถนำเสนอหน้าเว็บที่ปรับแต่งตามตำแหน่งที่ผู้ใช้ไปยัง เช่น แสดงภาพเคลื่อนไหวแบบอื่นหากผู้ใช้มาจากหน้าแรก
เหตุการณ์ pagereveal
ระบบจะเรียกเหตุการณ์ pagereveal
บนออบเจ็กต์หน้าต่างของเอกสารเมื่อมีโอกาสแสดงผลครั้งแรกหลังจากที่เอกสารโหลดครั้งแรก กู้คืนจากแคช Back-Forward หรือเปิดใช้งานจากการแสดงผลล่วงหน้า
ผู้เขียนหน้าเว็บสามารถใช้เพื่อตั้งค่าประสบการณ์การเข้าชมหน้าเว็บ เช่น การเปลี่ยนมุมมองจากสถานะก่อนหน้า
PointerEvent.deviceId สําหรับการเขียนด้วยปากกาหลายด้าม
เนื่องจากอุปกรณ์ที่ป้อนข้อมูลด้วยปากกาขั้นสูงมีการใช้งานมากขึ้นเรื่อยๆ แพลตฟอร์มเว็บจึงต้องพัฒนาอย่างต่อเนื่องเพื่อรองรับฟีเจอร์ขั้นสูงเหล่านี้อย่างเต็มรูปแบบ เพื่อปลดล็อกประสบการณ์การใช้งานที่สมบูรณ์สำหรับทั้งผู้ใช้ปลายทางและนักพัฒนาซอฟต์แวร์ ความก้าวหน้าอย่างหนึ่งคือความสามารถของอุปกรณ์ในการจดจำอุปกรณ์ปากกามากกว่า 1 เครื่องที่โต้ตอบกับอุปกรณ์พร้อมกัน ฟีเจอร์นี้เป็นส่วนขยายของอินเทอร์เฟซ PointerEvent
เพื่อรวมแอตทริบิวต์ใหม่ deviceId
ซึ่งแสดงตัวระบุที่ไม่ซ้ำกันแบบแยกเอกสารและคงอยู่ตลอดเซสชัน ซึ่งนักพัฒนาแอปสามารถใช้เพื่อระบุปากกาแต่ละด้ามที่ใช้โต้ตอบกับหน้าเว็บได้อย่างน่าเชื่อถือ
การตรวจสอบการเข้าถึงเครือข่ายส่วนตัวสําหรับคําขอการนําทาง: โหมดคําเตือนเท่านั้น
ก่อนที่เว็บไซต์ ก จะไปยังเว็บไซต์ ข ในเครือข่ายส่วนตัวของผู้ใช้ ฟีเจอร์นี้จะทําสิ่งต่อไปนี้
- ตรวจสอบว่าคำขอเริ่มต้นจากบริบทที่ปลอดภัยหรือไม่
- ส่งคำขอการตรวจสอบล่วงหน้า และตรวจสอบว่า B ตอบกลับด้วยส่วนหัวที่อนุญาตให้เข้าถึงเครือข่ายส่วนตัวหรือไม่
เรามีฟีเจอร์สําหรับทรัพยากรย่อยและแรงงานอยู่แล้ว แต่การเพิ่มนี้สําหรับคําขอการนําทางโดยเฉพาะ
การตรวจสอบเหล่านี้มีขึ้นเพื่อปกป้องเครือข่ายส่วนตัวของผู้ใช้ เนื่องจากฟีเจอร์นี้เป็นโหมด "คำเตือนเท่านั้น" จึงจะไม่ทำให้คำขอไม่ผ่านการตรวจสอบหากการตรวจสอบไม่ผ่าน แต่ระบบจะแสดงคำเตือนในเครื่องมือสำหรับนักพัฒนาเว็บแทน เพื่อช่วยนักพัฒนาแอปเตรียมพร้อมสำหรับการบังคับใช้ที่กําลังจะเกิดขึ้น
คำแนะนำสำหรับไคลเอ็นต์ Sec-CH-UA-Form-Factor
คำแนะนำนี้ระบุ "รูปแบบ" ของ User Agent หรืออุปกรณ์ เพื่อให้เว็บไซต์ปรับการตอบสนองได้
Service Worker Static Routing API
API นี้ช่วยให้นักพัฒนาซอฟต์แวร์กำหนดค่าการกำหนดเส้นทางได้ และช่วยให้นักพัฒนาซอฟต์แวร์สามารถส่งต่อการดำเนินการง่ายๆ ที่ Service Worker ทำได้ หากเงื่อนไขตรงกัน การนำทางจะเกิดขึ้นโดยไม่ต้องเริ่ม Service Worker หรือเรียกใช้ JavaScript ซึ่งช่วยให้เว็บเพจหลีกเลี่ยงการเสียประสิทธิภาพเนื่องจากการขัดจังหวะของ Service Worker ได้ ดูข้อมูลเพิ่มเติมได้ที่บล็อกโพสต์ก่อนหน้าเกี่ยวกับ API นี้
การอัปเดตพื้นที่เก็บข้อมูลที่ใช้ร่วมกัน
การอัปเดตนี้รองรับการเรียกใช้เวิร์กเลตข้ามต้นทางโดยไม่ต้องสร้าง iframe
Content-Encoding ของ zstd
Zstandard หรือ zstd คือกลไกการบีบอัดข้อมูลที่อธิบายไว้ใน RFC8878 ซึ่งเป็นอัลกอริทึมการบีบอัดแบบไม่สูญเสียข้อมูลที่รวดเร็ว โดยมุ่งเน้นที่สถานการณ์การบีบอัดแบบเรียลไทม์ที่ระดับ zlib และอัตราส่วนการบีบอัดที่ดีขึ้น มีการเพิ่มโทเค็น zstd
เป็นโทเค็นการเข้ารหัสเนื้อหาที่จดทะเบียนโดย IANA
การเพิ่มการรองรับ zstd
เป็น Content-Encoding จะช่วยให้หน้าเว็บโหลดเร็วขึ้น ใช้แบนด์วิดท์น้อยลง รวมถึงใช้เวลา CPU และพลังงานในการบีบอัดเซิร์ฟเวอร์น้อยลง ซึ่งจะช่วยลดค่าใช้จ่ายของเซิร์ฟเวอร์
ช่วงทดลองใช้จากต้นทางใหม่
ใน Chrome 123 คุณจะเลือกใช้ช่วงทดลองใช้จากต้นทางใหม่ต่อไปนี้ได้
การผสานรวมสัญญา JavaScript ของ WebAssembly
หากต้องการรองรับแอปพลิเคชันที่ปรับเปลี่ยนตามอุปกรณ์ซึ่งเขียนโดยใช้ WebAssembly คุณจำเป็นต้องจัดให้มีฟีเจอร์ที่อนุญาตให้ระงับและกลับมาทำงานต่อของโปรแกรม WebAssembly
กรณีการใช้งานหลักเบื้องต้นสำหรับการผสานรวม Promise คือการอนุญาตให้โปรแกรม WebAssembly ที่ใช้แหล่งที่มาของ API แบบซิงค์ใช้ API แบบแอซิงโครนัสซึ่งพบได้ทั่วไปในแพลตฟอร์มเว็บ
ลงทะเบียนเข้าร่วมช่วงทดลองใช้การผสานรวม Promise จากต้นทาง
การนำออก
Chrome 123 จะนําฟีเจอร์ต่อไปนี้ออก
window-placement
แทนสิทธิ์และนโยบายสิทธิ์ window-management
ใน Chrome 111 เราได้เพิ่ม window-management
ไว้เป็นชื่อแทนสำหรับสิทธิ์ window-placement
และสตริงนโยบายสิทธิ์
ซึ่งเป็นส่วนหนึ่งของความพยายามโดยรวมที่จะเปลี่ยนชื่อสตริงโดยเลิกใช้งานและนํา window-placement
ออกในที่สุด การเปลี่ยนแปลงคำศัพท์นี้จะช่วยยืดอายุการใช้งานของคําอธิบายประกอบได้ เนื่องจาก Window Management API พัฒนาไปเรื่อยๆ
เราเริ่มแสดงคำเตือนการเลิกใช้งานสำหรับอีเมลแทน window-placement
ใน Chrome 113 และตอนนี้จะนําอีเมลดังกล่าวออก