สรุปรายเดือนของเกณฑ์พื้นฐานเดือนมกราคม 2026

Jeremy Wagner

เผยแพร่: 2 มีนาคม 2026

ยินดีต้อนรับสู่ฉบับเดือนมกราคม 2026 ของสรุปข้อมูลพื้นฐาน ในแต่ละเดือน เราจะ ไฮไลต์ฟีเจอร์ของแพลตฟอร์มเว็บที่บรรลุเป้าหมายใหม่ใน Baseline เพื่อช่วยให้คุณเข้าใจว่าเครื่องมือใดพร้อมใช้งานใน โปรเจ็กต์ของคุณในวันนี้

เดือนมกราคมเป็นจุดเริ่มต้นที่น่าตื่นเต้นของปีนี้ โดยมี API และหน่วย CSS ที่สำคัญหลายรายการย้ายไปอยู่ในหมวดหมู่ "พร้อมใช้งานใหม่" พร้อมกับการปรับปรุงเลย์เอาต์ครั้งใหญ่ที่กลายเป็น "พร้อมใช้งานอย่างกว้างขวาง"

ฟีเจอร์ใหม่ที่พร้อมใช้งาน

ฟีเจอร์บนเว็บต่อไปนี้จะกลายเป็น Baseline ที่พร้อมใช้งานใหม่ในเดือนมกราคม 2026

การเปลี่ยนมุมมองแอ็กทีฟ

ตอนนี้ :active-view-transition คลาสเสมือน CSS พร้อมใช้งานแล้ว ตัวเลือกนี้ช่วยให้นักพัฒนาซอฟต์แวร์กำหนดเป้าหมายและ จัดรูปแบบองค์ประกอบรูทของเอกสารโดยเฉพาะในขณะที่การเปลี่ยนมุมมองกำลัง ดำเนินการอยู่ ซึ่งมีประโยชน์อย่างยิ่งสำหรับการใช้สไตล์หรือการปรับส่วนกลาง ที่ควรมีเฉพาะในช่วงเปลี่ยนผ่านเท่านั้น เช่น การเปลี่ยน สีพื้นหลังของภาพซ้อนทับการเปลี่ยนผ่านหรือการปรับดัชนี Z ของเลเยอร์ที่เฉพาะเจาะจง เพื่อให้มั่นใจว่าการไหลของภาพจะราบรื่น

โมดูล JavaScript ใน Service Worker

ตอนนี้ Service Worker รองรับโมดูล JavaScript ในเครื่องมือเบราว์เซอร์หลักๆ ทั้งหมดแล้ว การตั้งค่าตัวเลือก type: 'module' เมื่อเรียกใช้ navigator.serviceWorker.register() จะช่วยให้คุณใช้คำสั่ง import และ export มาตรฐานภายในสคริปต์ Service Worker ได้ ซึ่งจะทำให้ Service Worker สอดคล้องกับแนวทางปฏิบัติในการพัฒนา JavaScript สมัยใหม่ ช่วยให้จัดระเบียบโค้ดได้ดีขึ้น จัดการการอ้างอิงได้ง่ายขึ้น และแชร์โค้ดระหว่างชุดข้อความหลักกับ Worker ในเบื้องหลังได้

Navigation API เป็นทางเลือกที่ทันสมัยและสร้างขึ้นเพื่อวัตถุประสงค์เฉพาะแทนที่ History API แบบเดิม ซึ่งออกแบบมาเพื่อตอบสนองความต้องการของแอปพลิเคชันหน้าเว็บเดียว (SPA) โดยเฉพาะ ซึ่งเป็นวิธีแบบรวมศูนย์ในการเริ่มต้น สกัดกั้น และจัดการการดำเนินการนำทางทุกประเภท รวมถึงการดำเนินการที่ทริกเกอร์โดยปุ่มย้อนกลับและปุ่มไปข้างหน้าของเบราว์เซอร์ เหตุการณ์อย่าง Maps ช่วยให้นักพัฒนาแอปสามารถใช้การกำหนดเส้นทางฝั่งไคลเอ็นต์ที่ราบรื่นยิ่งขึ้น ด้วยโค้ดที่ซ้ำกันน้อยลง ดูข้อมูลเพิ่มเติมเกี่ยวกับวิธีที่การเปลี่ยนแปลงนี้ส่งผลต่อวิธีที่เราสร้างเว็บไซต์ได้ที่บล็อกโพสต์เฉพาะเรื่อง การกำหนดเส้นทางฝั่งไคลเอ็นต์ที่ทันสมัย: Navigation API

rcap หน่วย CSS

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

rch หน่วย CSS

ch แต่สัมพันธ์กับองค์ประกอบรูท หน่วย rch แสดงถึงความกว้าง หรือกล่าวอย่างเจาะจงคือการวัดระยะล่วงหน้าของกลีฟ "0" (ศูนย์) ในแบบอักษรขององค์ประกอบรูท เหมาะอย่างยิ่งสำหรับการสร้างเลย์เอาต์ที่ขึ้นอยู่กับความกว้างของอักขระ เช่น คอนเทนเนอร์ที่ควรพอดีกับจำนวนอักขระที่เฉพาะเจาะจงในแบบอักษรราก

rex หน่วย CSS

หน่วย rex คือ เวอร์ชันที่สัมพันธ์กับรูทของ ex ซึ่งเท่ากับความสูง x ของ แบบอักษรขององค์ประกอบรูท หน่วยนี้มีประโยชน์อย่างยิ่งสำหรับการจัดแนวตั้งและการปรับขนาด องค์ประกอบที่สัมพันธ์กับความสูงของตัวอักษรตัวพิมพ์เล็กใน การจัดรูปแบบตัวอักษรหลักของเอกสาร

ric หน่วย CSS

หน่วย ric คือ หน่วยที่เทียบเท่ากับหน่วย ic ที่สัมพันธ์กับรูท ซึ่งเท่ากับเมตริกการเลื่อน "อักษรภาพ" (โดยปกติคือความกว้างหรือความสูงของอักษรภาพ CJK) ของแบบอักษรขององค์ประกอบราก ซึ่งเป็นเครื่องมือสำคัญสำหรับนักพัฒนาแอปที่สร้างเลย์เอาต์ที่แปลเป็นภาษาต่างๆ โดยเฉพาะอย่างยิ่งผู้ที่ใช้สคริปต์ภาษาจีน ญี่ปุ่น หรือเกาหลี

ฟีเจอร์พื้นฐานที่พร้อมให้บริการในวงกว้าง

ฟีเจอร์บนเว็บต่อไปนี้พร้อมใช้งานใน Baseline อย่างกว้างขวางในเดือนมกราคม 2026

พร็อพเพอร์ตี้ CSS display ที่มี 2 ค่า

ตอนนี้ ไวยากรณ์แบบหลายคีย์เวิร์ดสำหรับพร็อพเพอร์ตี้ display พร้อมใช้งานใน Baseline Widely แล้ว การอัปเดตนี้ช่วยให้คุณกำหนดประเภทการแสดง "ด้านนอก" และ "ด้านใน" ของกล่องได้อย่างชัดเจน เช่น คุณสามารถใช้ display: inline flex แทน inline-flex ที่สร้างไว้ล่วงหน้าได้ ซึ่งจะระบุว่าองค์ประกอบมีส่วนร่วมในโฟลว์ระดับบล็อกหรือระดับอินไลน์ (ประเภทภายนอก) และวิธีจัดวางองค์ประกอบย่อย (ประเภทภายใน เช่น flex หรือ grid) การเปลี่ยนแปลงนี้จะทำให้เครื่องมือจัดวาง CSS มีตรรกะและสอดคล้องกันมากขึ้นสำหรับนักพัฒนาซอฟต์แวร์

พร็อพเพอร์ตี้ animation-composition CSS

พร็อพเพอร์ตี้ animation-composition กำหนดวิธีที่ภาพเคลื่อนไหวหลายรายการควรโต้ตอบกันเมื่อมีผลกับพร็อพเพอร์ตี้เดียวกันพร้อมกัน คุณเลือกได้ระหว่าง replace, add หรือ accumulate ซึ่งช่วยให้คุณควบคุมได้อย่างแม่นยำว่าระบบจะคำนวณภาพเคลื่อนไหวแบบซับซ้อนและแบบเลเยอร์ อย่างไร

อาร์เรย์โดยการคัดลอก

ตอนนี้ JavaScript มีเมธอดที่ช่วยให้คุณเปลี่ยนรูปแบบอาร์เรย์ โดยไม่ต้องเปลี่ยนแปลงข้อมูลต้นฉบับ เมธอดอย่าง toReversed(), toSorted() และ toSpliced() จะส่งคืนสำเนาอาร์เรย์ที่แก้ไขใหม่ ซึ่งส่งเสริมรูปแบบการเขียนโปรแกรมที่ ใช้งานได้และปลอดภัยยิ่งขึ้น

ช่วยเราปรับปรุง

เช่นเคย โปรดแจ้งให้เราทราบหากเราพลาดข้อมูลใดๆ ที่เกี่ยวข้องกับ Baseline และเราจะ ตรวจสอบว่าข้อมูลดังกล่าวจะรวมอยู่ในฉบับต่อๆ ไป หากมีข้อสงสัยหรือต้องการ แสดงความคิดเห็นเกี่ยวกับ Baseline คุณสามารถรายงานปัญหาในเครื่องมือติดตามปัญหาของเราได้