เผยแพร่เมื่อวันที่ 22 มกราคม 2025
เมื่อ Interop 2024 ใกล้จะสิ้นสุดลง โพสต์นี้จะมองย้อนกลับไปที่ปีแห่งความสำเร็จที่สุดของโปรเจ็กต์ เบราว์เซอร์เวอร์ชันทดลองทั้งหมดได้คะแนน 99 ส่วนเวอร์ชันที่เสถียรก็ตามมาติดๆ ความสำเร็จนี้หมายความว่าฟีเจอร์จํานวนหนึ่งพร้อมใช้งานใน Baseline เวอร์ชันใหม่แล้ว

ฟีเจอร์เพิ่มเติมใน Baseline
ฟีเจอร์ต้องทำงานร่วมกันได้จึงจะพร้อมใช้งานใน Baseline ใหม่ จึงไม่น่าแปลกใจเลยที่ Interop 2024 จะช่วยพัฒนาฟีเจอร์ต่างๆ ในช่วงนั้นและนำไปใช้ใน Baseline 2024
พร็อพเพอร์ตี้ที่กำหนดเองที่ลงทะเบียน
@property
กฎและCSS.registerProperty()
เมธอดแบบคงที่กลายเป็น Baseline
พร้อมใช้งานใหม่ในเดือนกรกฎาคม 2024
@property
ใน MDN- รายการ
@property
ในแดชบอร์ดแพลตฟอร์มเว็บ @property
: ตัวแปร CSS รุ่นถัดไปพร้อมให้ใช้งานในเบราว์เซอร์ทุกรุ่นแล้ว
พร็อพเพอร์ตี้ font-size-adjust
พร็อพเพอร์ตี้ font-size-adjust
CSS จะรักษาขนาดข้อความที่ปรากฏไว้ โดยไม่คำนึงถึงแบบอักษรที่ใช้ โดยการปรับขนาดแบบอักษรให้มีขนาดเท่ากันตามเมตริกที่เฉพาะเจาะจง เช่น ความสูงของ x วิธีนี้ช่วยให้แบบอักษรสำรองมีขนาดใหญ่เท่ากัน
โดยจะพร้อมใช้งานใน Baseline ใหม่ในเดือนกรกฎาคม 2024
font-size-adjust
ใน MDN- รายการ
font-size-adjust
ในแดชบอร์ดแพลตฟอร์มเว็บ - CSS
font-size-adjust
อยู่ในเกณฑ์พื้นฐานแล้ว
วิธีการ requestVideoFrameCallback()
สำหรับ <video>
เมธอด requestVideoFrameCallback()
สำหรับ <video>
จะกำหนดเวลาให้กับฟังก์ชันที่จะทำงานพร้อมกับเฟรมวิดีโอถัดไป ไอคอนนี้คล้ายกับ requestAnimationFrame()
แต่ใช้สำหรับวิดีโอและเพิ่งเปิดตัวไปเมื่อเดือนตุลาคม 2024
requestVideoFrameCallback()
ใน MDN- รายการ
requestVideoFrameCallback()
ในแดชบอร์ดแพลตฟอร์มเว็บ - ดำเนินการกับวิดีโอแต่ละเฟรมอย่างมีประสิทธิภาพด้วย
requestVideoFrameCallback()
การจัดสไตล์แถบเลื่อนด้วย scrollbar-width
และ scrollbar-gutter
scrollbar-width
พร็อพเพอร์ตี้ CSS จะกำหนดความกว้างของแถบเลื่อน และ
scrollbar-gutter
จัดสรรพื้นที่สำหรับแถบเลื่อน ซึ่งจะช่วยป้องกันการเปลี่ยนแปลงเลย์เอาต์ที่ไม่ต้องการเมื่อแถบเลื่อนปรากฏขึ้นและหายไป เนื้อหาเหล่านี้กลายเป็นเนื้อหาพื้นฐานที่พร้อมให้รับชมในเดือนธันวาคม 2024
พร็อพเพอร์ตี้ transition-behavior
การประกาศ CSS transition-behavior: allow-discrete
อนุญาตให้ใช้การเปลี่ยนสำหรับพร็อพเพอร์ตี้ที่มีลักษณะการทํางานของภาพเคลื่อนไหวเป็นแบบไม่ต่อเนื่อง พร็อพเพอร์ตี้ดังกล่าวจะไม่สามารถหาค่าเฉลี่ยและเปลี่ยนจากค่าเริ่มต้นเป็นค่าสิ้นสุดที่ 50% พร็อพเพอร์ตี้นี้กลายเป็น "ฐานข้อมูลใหม่" ในเดือนสิงหาคม 2024
transition-behavior
ใน MDN- รายการ
transition-behavior
ในแดชบอร์ดแพลตฟอร์มเว็บ - ตอนนี้มีให้ใช้งานใน Baseline แล้ว: เอฟเฟกต์ภาพเคลื่อนไหวของรายการ
text-wrap: balance
พร็อพเพอร์ตี้ CSS text-wrap
จะกำหนดการแบ่งบรรทัดในข้อความที่เกินจากคอนเทนเนอร์ ซึ่งเป็นตัวย่อของ text-wrap-style
และ text-wrap-mode
ค่า balance
ช่วยให้คุณสร้างบรรทัดแรกและข้อความสั้นๆ อื่นๆ ที่สมดุลได้ พร็อพเพอร์ตี้ text-wrap
กลายเป็น "ฐานใหม่" ที่พร้อมใช้งานในเดือนมีนาคม 2024
ป๊อปอัป
ป๊อปอัปช่วยให้คุณสร้างการวางซ้อนแบบประกาศโดยใช้ HTML หรือใช้เมธอด showPopover()
ฟีเจอร์นี้เกือบจะอยู่ในขั้น "พร้อมใช้งานใหม่" ตามเกณฑ์พื้นฐานแล้ว และตอนแรกเราคิดว่าเป็นเช่นนั้น แต่ปัญหาที่เกิดขึ้นกับการใช้งาน Safari ทำให้ฟีเจอร์นี้ยังไม่พร้อมใช้งานใหม่ในปี 2024 ข่าวดีคือปัญหานี้ได้รับการแก้ไขใน Safari เบต้า 18.3 ปัจจุบันแล้ว ดังนั้นอีกไม่นานเราจะประกาศอย่างเหมาะสมว่าป๊อปอัปพร้อมใช้งานเป็นเวอร์ชันพื้นฐานใหม่
การแก้ไขฟีเจอร์พื้นฐาน
มีฟีเจอร์บางอย่างรวมอยู่ใน Interop 2024 ที่จัดอยู่ในประเภท "ฐานใหม่พร้อมใช้งาน" อยู่แล้ว เราต้องแก้ไขความแตกต่างเล็กๆ น้อยๆ ในการใช้งาน ปัญหาเหล่านี้อาจเกิดขึ้นกับผู้ใช้เพียงไม่กี่คน แต่สิ่งเล็กๆ น้อยๆ ก็สร้างความแตกต่างได้เป็นอย่างมากหากเกิดขึ้นกับคุณ
การฝัง CSS
การฝัง CSS ช่วยให้เครื่องมือเลือกสั้นลง อ่านได้ง่ายขึ้น และเป็นแบบโมดูลมากขึ้นด้วยการฝังกฎไว้ในกฎอื่น ฟีเจอร์นี้กลายเป็น Baseline ใหม่ในเดือนธันวาคม 2023 และรวมอยู่ใน Interop 2024 เพื่อแก้ไขปัญหาการทำงานร่วมกันบางรายการที่ยังไม่ได้รับการแก้ไข
Shadow DOM แบบประกาศ
แอตทริบิวต์ shadowrootmode
ใน <template>
จะสร้างรูทเงาโดยไม่ต้องใช้ JavaScript นี่เป็นทางเลือกแบบประกาศสำหรับเมธอด `attachShadow()
Interop 2025 จะพร้อมใช้งานเร็วๆ นี้
ขณะนี้เรากําลังจัดทำข้อเสนอขั้นสุดท้ายสำหรับ Interop 2025 และเรายินดีที่จะต่อยอดความสำเร็จทั้งหมดในปีนี้ โปรดรอประกาศในเดือนกุมภาพันธ์เพื่อดูว่ามีอะไรให้บ้าง หากต้องการติดตามฟีเจอร์ต่างๆ ที่เปิดตัวใน Baseline โปรดดูชุดฟีเจอร์ใหม่ของ Baseline ที่นี่ใน web.dev