สำรวจฟีเจอร์ที่น่าสนใจบางส่วนซึ่งมีอยู่ในเว็บเบราว์เซอร์เวอร์ชันเสถียรและเวอร์ชันเบต้าในช่วงเดือนธันวาคม 2022
เบราว์เซอร์เวอร์ชันเสถียร
ในเดือนธันวาคม Firefox 108 และ Safari 16.2 เสถียรแล้ว เรามาดูความหมายของแพลตฟอร์มเว็บนี้กัน
การรองรับแอตทริบิวต์ height และ width ของ <source>
Firefox 108 รองรับแอตทริบิวต์ height และ width สำหรับองค์ประกอบ <source> เมื่อเป็นองค์ประกอบย่อยขององค์ประกอบ <picture> แอตทริบิวต์เหล่านี้ยอมรับความสูงหรือความกว้างของรูปภาพเป็นพิกเซลซึ่งเป็นจำนวนเต็มที่ไม่มีหน่วย
การสนับสนุนเบราว์เซอร์
- 90
- 90
- 108
- 15
ฟังก์ชัน CSS ตรีโกณมิติ
ตอนนี้ Firefox รองรับฟังก์ชันตรีโกณมิติใน CSS แล้ว ได้แก่ sin(), cos(), tan(), asin(), acos(), atan() และ atan2()
การรองรับเกณฑ์พื้นฐานล่าสุดในทั้ง 3 เครื่องมือ
นอกเหนือจากการแก้ไข CSS แล้ว Safari 16.2 ยังมีการปรับแนว last baseline สำหรับเลย์เอาต์แบบตารางกริด CSS และ Flexbox ซึ่งหมายความว่าตอนนี้เครื่องมือหลักของเบราว์เซอร์ 3 รายการรองรับฟีเจอร์นี้แล้ว
CSS font-variant-alternates
Safari ยังเพิ่มการรองรับค่าเพิ่มเติมสำหรับพร็อพเพอร์ตี้ CSS ของ font-variant-alternates ได้แก่คำอธิบายประกอบ(ชื่อ-ค่า), รูปแบบ-ตัวแปร(ชื่อ-ค่า), เครื่องประดับ(ชื่อค่า), สไตล์เซ็ต(ชื่อ-ค่า), สไตล์(ชื่อ-ค่า), สล้าง(ชื่อค่า) รวมถึงกฎ @font-feature-values ที่เกี่ยวข้อง
เบราว์เซอร์รุ่นเบต้า
เบราว์เซอร์รุ่นเบต้าช่วยให้คุณมีตัวอย่างของสิ่งที่จะอยู่ในเบราว์เซอร์เวอร์ชันเสถียรถัดไป ตอนนี้เป็นเวลาที่เหมาะแก่การทดสอบฟีเจอร์ใหม่หรือการนำออกที่อาจส่งผลต่อเว็บไซต์ก่อนที่โลกจะเปิดตัว เวอร์ชันเบต้าใหม่ ได้แก่ Firefox 109, Safari 16.3 และ Chrome 109
ฟีเจอร์ใหม่เดียวที่แสดงใน Safari 16.3 คือการเพิ่มคำสั่งของนโยบายรักษาความปลอดภัยเนื้อหา (CSP) prefetch-src นอกจากนี้ยังมีการแก้ไขอีกมากมายในรุ่นเบต้านี้
Chrome 109 รองรับ MathML Core ซึ่งเป็นภาษาสำหรับอธิบายสัญกรณ์ทางคณิตศาสตร์ที่ฝังอยู่ใน HTML และ SVG
ฟีเจอร์ใหม่ใน Chrome บน Android คือการยืนยันการชำระเงินที่ปลอดภัย (SPC) ซึ่งเป็นมาตรฐานเว็บที่เสนอซึ่งช่วยให้ลูกค้าตรวจสอบสิทธิ์กับผู้ออกบัตรเครดิต ธนาคาร หรือผู้ให้บริการชำระเงินอื่นๆ โดยใช้ Authenticator ของแพลตฟอร์ม ซึ่งโดยปกติแล้วจะเปิดใช้งานด้วยฟีเจอร์ปลดล็อกหน้าจอของอุปกรณ์ เช่น เซ็นเซอร์ลายนิ้วมือ
สิ่งใหม่สำหรับ Chrome ใน Android ก็คือระบบไฟล์ส่วนตัวต้นทาง (OPFS) ซึ่งเป็นส่วนหนึ่งของ File System Access API ใน Android ซึ่งรวมถึงแพลตฟอร์ม File System Access API ทั้งหมด ลบด้วยเมธอด show{OpenFile, SaveFile, Directory}Picker() และการผสานรวม API การลากและวาง
สำหรับ CSS ใน Chrome เรามีหน่วยความยาว lh หน่วยนี้เทียบเท่ากับค่าที่คำนวณแล้วของพร็อพเพอร์ตี้ความสูงบรรทัดในองค์ประกอบที่ใช้ นอกจากนี้ พร็อพเพอร์ตี้ hyphenate-limit-chars ยังระบุจำนวนอักขระขั้นต่ำในคำที่มีขีดกลางด้วย
ในขณะที่เขียนอยู่ และอาจยังไม่ได้อัปเดตบันทึกประจำรุ่นของ Firefox เนื่องจากช่วงวันหยุดเทศกาล
ข่าวอื่นๆ
โพสต์นี้เป็นฉบับที่ 12 ของชุดบล็อกโพสต์นี้ ซึ่งนำเสนอเรื่องที่น่าสนใจเกี่ยวกับเบราว์เซอร์ต่างๆ ในแต่ละเดือนในปี 2022 ฉันจะกลับมาในปี 2023 เพื่อแชร์สิ่งที่น่าสนใจบางส่วนในแพลตฟอร์มเว็บในแต่ละเดือน
หลายฟีเจอร์ในเบราว์เซอร์ในช่วงปีที่ผ่านมา และหลายๆ อย่างที่พูดถึงว่า "การแก้ไข CSS" เป็นส่วนหนึ่งของการทำงานร่วมกันปี 2022 อ่านข้อมูลเพิ่มเติมได้ในรายงานช่วงสิ้นปีของทีม Chrome เกี่ยวกับโครงการริเริ่มข้ามเบราว์เซอร์นี้ เพื่อปรับปรุงบางประเด็นปัญหาหลักเกี่ยวกับความสามารถในการทำงานร่วมกันในแพลตฟอร์มเว็บ
และสุดท้าย สิ่งที่เป็นที่สนใจสำหรับผู้ที่อ่านโพสต์นี้คือรายการอัปเดตนี้ซึ่งอิงตามข้อมูลความเข้ากันได้ของเบราว์เซอร์ MDN ซึ่งเพื่อนๆ ของเราเผยแพร่ที่ MDN
ส่วนหนึ่งของซีรีส์ใหม่สำหรับเว็บซีรีส์