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

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

เผยแพร่เมื่อวันที่ 30 เมษายน 2025

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

ในเดือนเมษายน 2025 Firefox 137, Firefox 138, Chrome 135 และ Chrome 136 กลายเป็นเวอร์ชันเสถียร โพสต์นี้จะกล่าวถึงฟีเจอร์ใหม่ที่เพิ่มลงในแพลตฟอร์มเว็บในช่วงเดือนที่มี Chrome และ Firefox เปิดตัว 2 เวอร์ชัน

ภาพสไลด์ใน Chrome

ฟีเจอร์หลายอย่างที่มีให้ใช้งานใน Chrome เวอร์ชัน 135 ช่วยให้สร้างภาพสไลด์และประสบการณ์การใช้งานแบบหน้าเว็บอื่นๆ บนเว็บได้

องค์ประกอบจำลอง ::scroll-button() และ ::scroll-marker() ช่วยให้คุณเพิ่มปุ่มและเครื่องหมายไปยังพื้นที่ที่เลื่อนได้ในเว็บไซต์ ซึ่งจะเป็นตัวควบคุมการไปยังส่วนต่างๆ และวิธีแสดงตำแหน่งของผู้ใช้ขณะเลื่อนดูภาพสไลด์

Browser Support

  • Chrome: 135.
  • Edge: 135.
  • Firefox: not supported.
  • Safari: not supported.

Source

องค์ประกอบจำลอง ::column ที่ช่วยให้คุณจัดสไตล์ให้กับส่วนของคอลัมน์ได้

Browser Support

  • Chrome: 135.
  • Edge: 135.
  • Firefox: not supported.
  • Safari: not supported.

Source

พร็อพเพอร์ตี้ interactivity จะระบุว่าองค์ประกอบและองค์ประกอบย่อยในต้นไม้แบบแบน (รวมถึงข้อความที่ต่อเนื่องกัน) เป็นแบบคงที่หรือไม่

Browser Support

  • Chrome: 135.
  • Edge: 135.
  • Firefox: not supported.
  • Safari: not supported.

การทำองค์ประกอบให้คงที่จะมีผลกระทบต่อความสามารถในการโฟกัส แก้ไข เลือก และค้นหาองค์ประกอบนั้นด้วยฟีเจอร์ค้นหาในหน้า และยังส่งผลต่อการแสดงรายการในต้นไม้การช่วยเหลือพิเศษด้วย

ดูข้อมูลเพิ่มเติมได้ที่ภาพสไลด์ด้วย CSS

แอตทริบิวต์ command และ commandfor

นอกจากนี้ แอตทริบิวต์ command และ commandfor ยังอยู่ใน Chrome 135 ด้วย ซึ่งจะช่วยปรับปรุงและแทนที่แอตทริบิวต์ popovertargetaction และ popovertarget คุณเพิ่มแอตทริบิวต์ใหม่เหล่านี้ลงในปุ่มได้ ซึ่งจะช่วยให้เบราว์เซอร์จัดการปัญหาหลักๆ บางประการเกี่ยวกับความเรียบง่ายและการช่วยเหลือพิเศษ รวมถึงมอบฟังก์ชันการทำงานทั่วไปในตัว

ดูข้อมูลเพิ่มเติมได้ในขอแนะนำ command และ commandfor

Browser Support

  • Chrome: 135.
  • Edge: 135.
  • Firefox: behind a flag.
  • Safari Technology Preview: supported.

Source

ฟังก์ชัน CSS shape()

ฟังก์ชัน shape() CSS ใน Chrome 135 ใช้เพื่อกำหนดรูปร่างสำหรับพร็อพเพอร์ตี้ clip-path และ offset-path ดูวิธีใช้ฟีเจอร์นี้สําหรับการตัดวิดีโอที่ปรับเปลี่ยนตามพื้นที่โฆษณา ฟังก์ชันนี้พร้อมใช้งานใน Safari 18.4 และ Firefox Nightly แล้ว และหวังว่าจะพร้อมใช้งานใน Baseline ใหม่ในเร็วๆ นี้

Browser Support

  • Chrome: 135.
  • Edge: 135.
  • Firefox Technology Preview: supported.
  • Safari: 18.4.

Source

Atomics.pause()

Firefox 137 มีฟีเจอร์นี้ในAtomics.pause() ทำให้ฟีเจอร์นี้พร้อมใช้งานในรุ่นพื้นฐาน เมธอดแบบคงที่นี้ให้พรอมต์การรอแบบไมโครที่บอก CPU ว่าผู้เรียกกำลังทำงานอยู่ขณะรอการเข้าถึงทรัพยากรที่แชร์ ซึ่งจะช่วยให้ระบบลดทรัพยากรที่จัดสรรให้กับแกนหลัก (เช่น พลังงาน) หรือเธรดได้โดยไม่ต้องหยุดเธรดปัจจุบัน

Browser Support

  • Chrome: 133.
  • Edge: 133.
  • Firefox: 137.
  • Safari: 18.4.

Source

CSS hyphenate-limit-chars

Firefox 137 ยังมีพร็อพเพอร์ตี้ CSShyphenate-limit-chars ด้วย พร็อพเพอร์ตี้นี้ระบุความยาวคำขั้นต่ำที่อนุญาตให้มีการแบ่งคำ และจำนวนอักขระขั้นต่ำก่อนและหลังขีดกลาง

Browser Support

  • Chrome: 109.
  • Edge: 109.
  • Firefox: 137.
  • Safari: not supported.

Source

RegExp.escape

เมธอดแบบคงที่ RegExp.escape ได้เปิดตัวในเบราว์เซอร์ทั้งหมดภายในไม่กี่เดือน และกลายเป็น Baseline ใหม่เมื่อเปิดตัวใน Chrome 136

เมธอดนี้จะหลีกหนีอักขระไวยากรณ์นิพจน์ทั่วไปที่เป็นไปได้ในสตริง โดยจะแสดงผลสตริงใหม่ที่สามารถใช้เป็นรูปแบบตัวอักษรล้วนได้อย่างปลอดภัยสำหรับตัวสร้าง RegExp()

Browser Support

  • Chrome: 136.
  • Edge: 136.
  • Firefox: 134.
  • Safari: 18.2.

Source

Error.isError()

เมธอด static ของ Error.isError() จะกำหนดว่าค่าที่ส่งเป็นข้อผิดพลาดหรือไม่ ซึ่งรวมอยู่ใน Firefox 138 แม้ว่าจะมีเบราว์เซอร์ที่รองรับในทุกเบราว์เซอร์ แต่ยังไม่ถือว่าเป็น Baseline ใหม่เนื่องจากขณะนี้ Safari แสดงผล false สำหรับอินสแตนซ์ DOMException

Browser Support

  • Chrome: 134.
  • Edge: 134.
  • Firefox: 138.
  • Safari: 18.4.

Source

Login Status API สำหรับ FedCM

Firefox 138 รองรับ Login Status API เมื่อใช้ Federated Credential Management (FedCM) API ข้อมูลนี้ใช้เพื่อตั้งค่าและตรวจสอบว่าผู้ใช้เบราว์เซอร์เข้าสู่ระบบผู้ให้บริการข้อมูลประจำตัวหรือไม่ Firefox 138 รองรับอินเทอร์เฟซ NavigatorLogin, พร็อพเพอร์ตี้ navigator.login และส่วนหัวการตอบกลับ HTTP Set-Login

Browser Support

  • Chrome: 120.
  • Edge: 120.
  • Firefox: 138.
  • Safari: not supported.

Source

ความสมบูรณ์ของ Importmap

ใน Firefox 138 ค่า importmap ของแอตทริบิวต์ type ขององค์ประกอบ <script> รองรับคีย์ integrity แล้ว ซึ่งจะช่วยให้ระบบจับคู่ URL ของโมดูล ES ที่อ้างอิงในแผนที่การนําเข้ากับข้อมูลเมตาความสมบูรณ์ของโมดูลได้ ฟีเจอร์นี้พร้อมให้บริการใน Baseline เวอร์ชันใหม่แล้ว

Browser Support

  • Chrome: 127.
  • Edge: 127.
  • Firefox: 138.
  • Safari: 18.

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

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

จนถึงตอนนี้ Safari 18.5 เบต้ามีการแก้ไขข้อบกพร่องเพียงไม่กี่รายการหลังจากการเปิดตัว 18.4 ครั้งใหญ่

ขณะเขียนบทความนี้ Firefox ยังไม่ได้เผยแพร่บันทึกประจำรุ่น แต่ดูเหมือนว่ารุ่นเบต้าจะรวมTemporal API ไว้ด้วย ซึ่งทำให้ Firefox เป็นเบราว์เซอร์แรกที่เปิดตัว Date เวอร์ชันปรับปรุงนี้ นอกจากนี้ ยังมีการใช้ <dialog> request.close() ซึ่งจะนำวิธีการนี้ไปใช้กับ Baseline ที่เพิ่งเปิดตัว