แพลตฟอร์มเว็บใหม่ในเดือนพฤษภาคม

สำรวจฟีเจอร์ที่น่าสนใจบางส่วนที่เปิดตัวในเว็บเบราว์เซอร์เวอร์ชันเสถียรและเบต้าในช่วงเดือนพฤษภาคม 2025

Rachel Andrew

เผยแพร่: 29 พฤษภาคม 2025

เบราว์เซอร์รุ่นที่เสถียร

ในเดือนพฤษภาคม 2025 Firefox 139, Chrome 137 และ Safari 18.5 กลายเป็นเวอร์ชันเสถียร โพสต์นี้จะกล่าวถึงฟีเจอร์ใหม่ที่เพิ่มลงในแพลตฟอร์มเว็บพร้อมกับรุ่นเหล่านี้

Temporal API

Firefox 139 เป็นเบราว์เซอร์แรกที่รองรับ Temporal API ซึ่งช่วยให้ทำงานกับวันที่และเวลาในสถานการณ์ต่างๆ ได้ง่ายขึ้นด้วยการแสดงเขตเวลาและปฏิทินที่มาพร้อมใช้งาน

hidden=until-found และกิจกรรม beforematch

Firefox 139 ยังมีแอตทริบิวต์ hidden="until-found" HTML และเหตุการณ์ beforematch ด้วย สถานะ until-found ช่วยให้คุณซ่อนเนื้อหาขององค์ประกอบได้จนกว่าผู้ใช้จะค้นหาเจอ (เช่น การใช้ "ค้นหาในหน้า") หรือโดยการไปยังส่วนต่างๆ เหตุการณ์ beforematch จะทริกเกอร์ขึ้นก่อนที่ระบบจะนำแอตทริบิวต์ hidden ออก

requestClose() วิธี

ตอนนี้มีวิธีการ requestClose() ของอินเทอร์เฟซ HTMLDialogElement ใหม่ในรุ่น Firefox 139

เมธอดนี้แตกต่างจากเมธอด HTMLDialogElement.close() ตรงที่จะเรียกเหตุการณ์ cancel ก่อนที่จะเรียกเหตุการณ์ close

CSS reading-flow และ reading-order

Chrome 137 มาพร้อมกับ reading-flow และ reading-order พร็อพเพอร์ตี้ reading-flow CSS จะควบคุมลําดับที่องค์ประกอบในเลย์เอาต์ Flex, ตาราง หรือบล็อกจะแสดงต่อเครื่องมือการช่วยเหลือพิเศษ และวิธีที่องค์ประกอบเหล่านั้นได้รับโฟกัสโดยใช้วิธีการไปยังส่วนต่างๆ ตามลําดับแบบเส้นตรง ซึ่งช่วยแก้ปัญหาที่แก้ยากมาอย่างยาวนานเกี่ยวกับเลย์เอาต์ตารางกริดและ Flex ซึ่งลําดับแท็บอาจไม่ตรงกับลําดับการจัดวางรายการ

พร็อพเพอร์ตี้ CSS reading-order ช่วยให้คุณลบล้างลําดับของรายการในคอนเทนเนอร์การอ่านด้วยตนเองได้ หากต้องการใช้พร็อพเพอร์ตี้นี้ภายในคอนเทนเนอร์ตารางกริด คอนเทนเนอร์ Flex หรือคอนเทนเนอร์บล็อก ให้ตั้งค่า reading-flow ในคอนเทนเนอร์เป็น source-order และตั้งค่า reading-order ของแต่ละรายการเป็นค่าจำนวนเต็ม

อ่านข้อมูลเพิ่มเติมได้ในหัวข้อใช้ลำดับการอ่าน CSS เพื่อการไปยังส่วนต่างๆ ตามลำดับแบบมีเหตุผล

ฟังก์ชัน if() ของ CSS

นอกจากนี้ ใน Chrome 137 ฟังก์ชัน if() ของ CSS ยังมีวิธีแสดงค่าแบบมีเงื่อนไขที่กระชับ โดยยอมรับชุดคู่เงื่อนไข-ค่าที่คั่นด้วยเครื่องหมายอัฒภาค ฟังก์ชันจะประเมินแต่ละเงื่อนไขตามลําดับและแสดงผลค่าที่เชื่อมโยงกับเงื่อนไขแรกที่เป็นจริง หากไม่มีเงื่อนไขใดที่ประเมินเป็น "จริง" ฟังก์ชันจะแสดงผลสตรีมโทเค็นว่าง

Document-Isolation-Policy

Document-Isolation-Policy ที่มาพร้อมกับ Chrome 137 จะช่วยให้เอกสารเปิดใช้ crossOriginIsolation ได้ด้วยตนเองโดยไม่ต้องติดตั้งใช้งาน COOP หรือ COEP และไม่คำนึงถึงสถานะ crossOriginIsolation ของหน้าเว็บ นโยบายนี้ได้รับการสนับสนุนโดยการแยกกระบวนการ นอกจากนี้ ทรัพยากรย่อยข้ามโดเมนที่ไม่ใช่ CORS ของเอกสารจะโหลดโดยไม่มีข้อมูลเข้าสู่ระบบหรือจะต้องมีส่วนหัว CORP

พุชจากเว็บแบบประกาศ

Safari 18.5 เป็นการอัปเดตที่เน้นการแก้ไขข้อบกพร่องเป็นหลัก แต่ก็มีการเพิ่ม Declarative Web Push ลงใน macOS ซึ่งเป็นฟีเจอร์ที่ตอนนี้มีให้บริการใน Safari เท่านั้น ดูข้อมูลเพิ่มเติมได้ในบทความพบกับ Web Push แบบประกาศในบล็อก WebKit

เบราว์เซอร์รุ่นเบต้า

เวอร์ชันเบต้าของเบราว์เซอร์จะแสดงตัวอย่างฟีเจอร์ที่จะอยู่ในเบราว์เซอร์เวอร์ชันเสถียรเวอร์ชันถัดไป นี่เป็นโอกาสที่ดีในการทดสอบฟีเจอร์ใหม่หรือการนําออกที่อาจส่งผลต่อเว็บไซต์ของคุณก่อนที่ผู้ใช้ทั่วโลกจะได้รับฟีเจอร์หรือการเปลี่ยนแปลงนั้น เบต้าเวอร์ชันใหม่คือ Firefox 140 และ Chrome 138

Firefox 140 มีชุดย่อยของ Cookie Store API ซึ่งเป็นเมธอดการจัดการคุกกี้แบบใหม่แบบแอซิงโครนัสซึ่งอิงตาม Promise สามารถใช้ได้ทั้งในเธรดหลักและใน Service Worker

Chrome 138 มี API ของ AI ในตัวหลายรายการ ได้แก่ Summarizer API, Language Detector API และ Translator API

นอกจากนี้ Chrome 138 ยังมีฟีเจอร์ CSS หลายอย่าง รวมถึงคีย์เวิร์ดstretchสำหรับกำหนดขนาด และฟังก์ชัน sibling-index() และ sibling-count()