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

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

Rachel Andrew

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

ในเดือนพฤษภาคม Chrome 102, Safari 15.5, Firefox 100 และ Firefox 101 กลายเป็นเวอร์ชันเสถียร

Chrome 102 และ Safari 15.5 มีแอตทริบิวต์ inert ซึ่งจะนำองค์ประกอบออกจากลําดับแท็บและลําดับชั้นการช่วยเหลือพิเศษหากองค์ประกอบดังกล่าวไม่โต้ตอบ เช่น องค์ประกอบที่อยู่นอกหน้าจอหรือซ่อนอยู่

การรองรับเบราว์เซอร์

  • Chrome: 102
  • Edge: 102
  • Firefox: 112
  • Safari: 15.5

แหล่งที่มา

Chrome 102 มีค่าใหม่ until-found สำหรับแอตทริบิวต์ HTML hidden ซึ่งจะเปิดใช้การค้นหาในหน้าเว็บและเลื่อนไปยังข้อความที่ตัดตอนมาจากข้อความที่อยู่ภายในส่วนที่ยุบของหน้าเว็บ ดังที่คุณอาจพบในรูปแบบ Accordion ดูข้อมูลเพิ่มเติมได้ในโพสต์การทำให้เนื้อหาแบบยุบเข้าถึงได้โดยใช้ hidden=until-found

การรองรับเบราว์เซอร์

  • Chrome: 102
  • Edge: 102
  • Firefox: ไม่รองรับ
  • Safari: ไม่รองรับ

แหล่งที่มา

Chrome 102 มาพร้อมกับ Navigation API ซึ่งเป็น API ที่กำหนดมาตรฐานการกำหนดเส้นทางฝั่งไคลเอ็นต์ในแอปพลิเคชันหน้าเว็บเดียว ก่อนหน้านี้ API นี้เรียกว่า App History API

การรองรับเบราว์เซอร์

  • Chrome: 102
  • Edge: 102
  • Firefox: ไม่รองรับ
  • Safari: ไม่รองรับ

แหล่งที่มา

Firefox 101 รองรับสไตล์ชีตที่สร้างได้ การสนับสนุนประกอบด้วยตัวสร้าง CSSStyleSheet() และเมธอด replace() และ replaceSync() สไตล์ชีตที่สร้างได้ช่วยให้สร้างสไตล์ชีตเพื่อใช้กับ Shadow DOM ได้ง่ายขึ้น ในตัวอย่างต่อไปนี้ ระบบจะสร้างสไตล์ชีตโดยใช้คอนสตรัคเตอร์ CSSStyleSheet() เพิ่มกฎ CSS ด้วยเมธอด replaceSync() และพิมพ์กฎที่ได้ลงในคอนโซล

const stylesheet = new CSSStyleSheet();
stylesheet.replaceSync('body { color: red; }');
console.log(stylesheet.rules[0].cssText);

การรองรับเบราว์เซอร์

  • Chrome: 73
  • Edge: 79
  • Firefox: 101.
  • Safari: 16.4

แหล่งที่มา

นอกจากนี้ Firefox 101 ยังมีฟีเจอร์สื่อ prefers-contrast ซึ่งทำให้ฟีเจอร์นี้ใช้งานได้ในหลายเบราว์เซอร์

การรองรับเบราว์เซอร์

  • Chrome: 96
  • Edge: 96
  • Firefox: 101.
  • Safari: 14.1

แหล่งที่มา

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

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

เบต้าใหม่ในเดือนเมษายน ได้แก่ Chrome 103 และ Firefox 102

Firefox 102 มีฟีเจอร์สื่อ update ข้อมูลนี้ใช้เพื่อสอบถามว่าอุปกรณ์เอาต์พุตสามารถแก้ไขลักษณะที่ปรากฏของเนื้อหาได้หรือไม่เมื่อผ่านการแสดงผลแล้ว ค่าที่ใช้ได้มีดังนี้

none
เมื่อแสดงผลแล้ว คุณจะอัปเดตเนื้อหาไม่ได้ เช่น เอกสารที่พิมพ์
slow
อุปกรณ์อัปเดตเนื้อหาได้ แต่ช้าเกินกว่าที่จะแสดงภาพเคลื่อนไหวอย่างราบรื่น เช่น หน้าจอ E-ink
fast
เนื้อหาสามารถเปลี่ยนแปลงแบบไดนามิกและรวดเร็วพอที่จะแสดงภาพเคลื่อนไหว เช่น หน้าจอคอมพิวเตอร์หรือโทรศัพท์

การรองรับเบราว์เซอร์

  • Chrome: 113
  • Edge: 113
  • Firefox: 102
  • Safari: 17.

แหล่งที่มา

Chrome 103 มี Local Font Access API ซึ่งอนุญาตให้เข้าถึงแบบอักษรที่ติดตั้งในเครื่องของผู้ใช้

ฟีเจอร์เบต้าเหล่านี้จะพร้อมใช้งานในเบราว์เซอร์เวอร์ชันเสถียรในเร็วๆ นี้

แก้ไข: เวอร์ชันก่อนหน้าของโพสต์นี้มีการพูดถึงวิธีการ Element.isVisible() ซึ่งไม่ได้รวมอยู่ในรุ่นนี้

เป็นส่วนหนึ่งของชุดวิดีโอ "เพิ่งเคยใช้เว็บ"