สำรวจฟีเจอร์ที่น่าสนใจบางส่วนที่เปิดตัวในเบราว์เซอร์เวอร์ชันเสถียรและเบต้าในเดือนกันยายน 2024
เบราว์เซอร์รุ่นที่เสถียร
ในเดือนกันยายน 2024 Firefox 130, Safari 18 และ Chrome 129 กลายเป็นเวอร์ชันเสถียร โพสต์นี้จะกล่าวถึงฟีเจอร์ใหม่ที่เพิ่มลงในแพลตฟอร์มเว็บ
กล่อง Accordion พิเศษที่มีแอตทริบิวต์ name
สำหรับ <details>
Firefox 130 รองรับแอตทริบิวต์ name
ขององค์ประกอบ <details>
ซึ่งจะจัดกลุ่มองค์ประกอบ <details>
โดยเปิดได้ครั้งละองค์ประกอบเดียวในกลุ่ม ซึ่งจะช่วยให้คุณสร้าง Accordion พิเศษได้โดยไม่ต้องใช้ JavaScript
Browser Support
ภาพเคลื่อนไหวเป็นอัตโนมัติ (และอื่นๆ)
Chrome 129 เพิ่มพร็อพเพอร์ตี้ interpolate-size
และฟังก์ชัน calc-size()
ของ CSS
พร็อพเพอร์ตี้ interpolate-size
ของ CSS ช่วยให้หน้าเว็บเลือกใช้ภาพเคลื่อนไหวและการเปลี่ยนรูปแบบของคีย์เวิร์ดการปรับขนาดตามค่าเริ่มต้นของ CSS ได้ เช่น auto
, min-content
และ fit-content
ในกรณีที่ใช้คีย์เวิร์ดเหล่านั้นสร้างภาพเคลื่อนไหวได้
ฟังก์ชัน calc-size()
ของ CSS เป็นฟังก์ชัน CSS ที่คล้ายกับ calc()
แต่รองรับการดำเนินการกับคีย์เวิร์ดการปรับขนาดที่รองรับเพียง 1 รายการเท่านั้น
คีย์เวิร์ดการปรับขนาดที่รองรับ ได้แก่ auto
, min-content
, max-content
และ fit-content
ดูข้อมูลเพิ่มเติมในAnimate to height: auto; (และคำค้นหาการปรับขนาดอื่นๆ ที่เกี่ยวข้อง) ใน CSS
จัดรูปแบบระยะเวลาใน JavaScript
นอกจากนี้ ใน Chrome 129 ยังมี Intl.DurationFormat
ซึ่งระบุวิธีการจัดรูปแบบระยะเวลา เช่น "1 ชม. 40 นาที 30 วินาที" ที่รองรับหลายภาษา
WebCodecs API
ตอนนี้ Firefox 130 บนเดสก์ท็อปรองรับ Web Codecs API แล้ว ซึ่งช่วยให้นักพัฒนาเว็บเข้าถึงระดับล่างของเฟรมแต่ละเฟรมในสตรีมวิดีโอและกลุ่มเสียงได้ อินเทอร์เฟซใหม่ ได้แก่ VideoEncoder
, VideoDecoder
,
EncodedVideoChunk
, VideoFrame
และ VideoColorSpace
API นี้ไม่ได้ทำให้ Baseline New พร้อมใช้งานเนื่องจาก Firefox Android ยังไม่รองรับ แต่รองรับ Firefox Nightly สำหรับ Android
การค้นหาสไตล์ CSS สําหรับพร็อพเพอร์ตี้ที่กําหนดเอง
Safari 18 รองรับฟีเจอร์ใหม่ๆ หลายอย่าง รวมถึงการค้นหาสไตล์ CSS การค้นหาสไตล์เป็นวิธีสร้างสไตล์ที่ใช้ซ้ำได้ และนำไปใช้แบบเป็นกลุ่ม เช่น เมื่อคุณมีคอมโพเนนต์ที่ใช้ซ้ำได้ซึ่งมีหลายรูปแบบ
ดูข้อมูลเพิ่มเติมเกี่ยวกับการค้นหาสไตล์ CSS
การเปลี่ยนมุมมองเอกสารเดียวกัน
Safari 18 ยังรองรับการเปลี่ยนมุมมองเอกสารเดียวกันสำหรับ SPA ด้วย ซึ่งจะช่วยให้คุณสร้างการเปลี่ยนภาพระหว่างสถานะต่างๆ ของแอปได้
ดูข้อมูลเพิ่มเติมเกี่ยวกับการเปลี่ยนมุมมองเอกสารเดียวกัน
เบราว์เซอร์รุ่นเบต้า
เวอร์ชันเบต้าของเบราว์เซอร์จะแสดงตัวอย่างฟีเจอร์ที่จะอยู่ในเบราว์เซอร์เวอร์ชันเสถียรเวอร์ชันถัดไป นี่เป็นโอกาสที่ดีในการทดสอบฟีเจอร์ใหม่หรือการนําออกที่อาจส่งผลต่อเว็บไซต์ของคุณก่อนที่ผู้ใช้ทั่วโลกจะได้รับฟีเจอร์หรือการเปลี่ยนแปลงนั้น เบราว์เซอร์รุ่นเบต้าใหม่ ได้แก่ Firefox 131, Chrome 130 และ Safari 18.1 การเปิดตัวเหล่านี้จะเพิ่มฟีเจอร์ที่ยอดเยี่ยมมากมายลงในแพลตฟอร์ม ดูรายละเอียดทั้งหมดได้ในบันทึกประจำรุ่น ต่อไปนี้เป็นไฮไลต์บางส่วน
Firefox 131 มีตัวช่วยตัวดำเนินการ JavaScript ใหม่ และคุกกี้ที่มีสถานะการแบ่งพาร์ติชันอิสระ (CHIPS) พร้อมให้ใช้งานแล้ว
Chrome 130 รองรับ box-decoration-break: clone
ทั้งสำหรับการแยกย่อหน้าย่อยในบรรทัด (เลย์เอาต์บรรทัด) และการแยกย่อหน้าย่อยของบล็อก (การแยกย่อหน้าย่อยที่สร้างสำหรับการพิมพ์และหลายคอลัมน์) นอกจากนี้ การรายงานข้อผิดพลาดใน IndexedDB ยังดีขึ้นด้วย และยังมีแอตทริบิวต์ connected
ใหม่สําหรับอินเทอร์เฟซ Web Serial SerialPort
Safari 18.1 เป็นรุ่นที่มีการแก้ไขข้อบกพร่องของฟีเจอร์ที่มีอยู่