Interop 2024 mang đến nhiều tính năng hơn cho Baseline

Ngày phát hành: 22 tháng 1 năm 2025

Khi Interop 2024 sắp kết thúc, bài đăng này sẽ nhìn lại năm thành công nhất từ trước đến nay của dự án. Kết quả cuối cùng là tất cả trình duyệt thử nghiệm đều báo cáo điểm số là 99, trong khi các phiên bản ổn định không kém là bao. Thành công này có nghĩa là một số tính năng hiện đã có trong Baseline New.

Tất cả trình duyệt có điểm số là 99.
Trang tổng quan về Interop 2024 (kể từ ngày 22 tháng 1 năm 2025)

Các tính năng khác của Baseline

Để được đưa vào Baseline Newly available, tính năng cần có khả năng tương tác. Do đó, không có gì ngạc nhiên khi Interop 2024 đã giúp một số tính năng vượt qua dòng đó và chuyển sang Baseline 2024.

Thuộc tính tuỳ chỉnh đã đăng ký

Quy tắc @property và phương thức tĩnh CSS.registerProperty() trở thành Đường cơ sở mới có từ tháng 7 năm 2024.

Thuộc tính font-size-adjust

Thuộc tính CSS font-size-adjust giữ nguyên kích thước văn bản rõ ràng, bất kể phông chữ được sử dụng, bằng cách điều chỉnh tỷ lệ phông chữ theo cùng một kích thước liên quan đến một chỉ số cụ thể, chẳng hạn như chiều cao x. Điều này có thể giúp phông chữ dự phòng có cùng kích thước. Báo cáo này đã trở thành báo cáo Giá trị cơ sở mới từ tháng 7 năm 2024.

Phương thức requestVideoFrameCallback() cho <video>

Phương thức requestVideoFrameCallback() cho <video> lên lịch một hàm chạy với khung video tiếp theo. Phương thức này tương tự như requestAnimationFrame(), nhưng dành cho video và được ra mắt vào tháng 10 năm 2024.

Tạo kiểu thanh cuộn bằng scrollbar-widthscrollbar-gutter

Thuộc tính CSS scrollbar-width đặt chiều rộng của thanh cuộn và scrollbar-gutter dành không gian cho thanh cuộn, ngăn chặn các thay đổi không mong muốn về bố cục khi thanh cuộn xuất hiện và biến mất. Các chỉ số này đã trở thành Giá trị cơ sở mới vào tháng 12 năm 2024.

Thuộc tính transition-behavior

Nội dung khai báo CSS transition-behavior: allow-discrete cho phép chuyển đổi cho các thuộc tính có hành vi ảnh động riêng biệt. Bạn không thể nội suy và hoán đổi các thuộc tính như vậy từ giá trị bắt đầu sang giá trị kết thúc ở mức 50%. Thuộc tính này đã trở thành Đường cơ sở mới có sẵn từ tháng 8 năm 2024.

text-wrap: balance

Thuộc tính CSS text-wrap đặt cách dòng ngắt trong văn bản tràn ra vùng chứa. Đây là viết tắt của text-wrap-styletext-wrap-mode. Giá trị balance cho phép bạn tạo dòng tiêu đề cân bằng và các đoạn văn bản ngắn khác. Thuộc tính text-wrap đã trở thành Đường cơ sở mới có sẵn từ tháng 3 năm 2024.

Cửa sổ bật lên

Cửa sổ bật lên cho phép bạn tạo lớp phủ theo cách khai báo bằng HTML hoặc bằng phương thức showPopover(). Tính năng này gần như đã đạt đến cấp độ Mới có trong Baseline, và thực tế là ban đầu chúng tôi nghĩ rằng tính năng này đã đạt đến cấp độ đó. Tuy nhiên, một vấn đề với việc triển khai Safari khiến tính năng này không đạt đến cấp độ Mới có trong năm 2024. Tin vui là vấn đề này đã được khắc phục trong Safari Beta 18.3 hiện tại, vì vậy, chúng tôi sẽ sớm có thể thông báo chính xác rằng Popover là Đường cơ sở mới có sẵn.

Sửa lỗi cho các tính năng của Đường cơ sở

Có một số tính năng trong Interop 2024 đã được phân loại là Điểm chuẩn mới có sẵn, công việc là khắc phục một số khác biệt nhỏ trong quá trình triển khai. Đây có thể là những vấn đề mà rất ít người gặp phải, tuy nhiên, những điều nhỏ nhặt có thể tạo ra sự khác biệt lớn nếu bạn gặp phải.

Lồng CSS

Tính năng lồng ghép CSS cho phép các bộ chọn ngắn hơn, dễ đọc hơn và có tính mô-đun hơn bằng cách lồng ghép các quy tắc bên trong các quy tắc khác. Tính năng này đã trở thành Baseline mới có sẵn vào tháng 12 năm 2023 và được đưa vào Interop 2024 để khắc phục một số vấn đề về khả năng tương tác còn tồn đọng.

Shadow DOM khai báo

Thuộc tính shadowrootmode trên <template> tạo một gốc bóng mà không cần sử dụng JavaScript. Đây là một phương thức khai báo thay thế cho phương thức `attachShadow()`.

Interop 2025 sắp ra mắt

Chúng tôi đang hoàn tất các đề xuất cho Interop 2025 và rất hào hứng với việc tiếp tục phát huy những thành công của năm nay. Hãy chú ý theo dõi thông báo vào tháng 2 để biết nội dung của gói này. Để theo dõi các tính năng mới có trong Điểm chuẩn, hãy xem loạt bài viết Các tính năng mới có trong Điểm chuẩn tại web.dev.