Điểm mới trên nền tảng web vào tháng 4

Khám phá một số tính năng thú vị đã ra mắt trong các trình duyệt web phiên bản ổn định và thử nghiệm vào tháng 4 năm 2023.

Rachel Andrew

Bản phát hành trình duyệt ổn định

Vào tháng 4 năm 2023, Firefox 112 và Chrome 112 đã trở nên ổn định. Hãy cùng xem điều này có ý nghĩa gì đối với nền tảng web.

Thuộc tính inert

Firefox 112 bao gồm thuộc tính toàn cục inert. Thuộc tính này yêu cầu trình duyệt bỏ qua phần tử, cho biết nội dung không được tương tác. Tính năng tự động gắn thẻ:

  • Ngăn sự kiện click được kích hoạt.
  • Ngăn phần tử lấy tiêu điểm.
  • Loại trừ phần tử và nội dung của phần tử khỏi cây hỗ trợ tiếp cận.

Thuộc tính này hiện có thể tương tác trong cả ba công cụ.

Hỗ trợ trình duyệt

  • Chrome: 102.
  • Edge: 102.
  • Firefox: 112.
  • Safari: 15.5.

Nguồn

Hàm làm mượt linear()

Hàm easing linear() cho phép nội suy tuyến tính giữa một số điểm. Điều này cho phép tạo các ảnh động phức tạp hơn như hiệu ứng bật và đàn hồi. Hàm này có trong Firefox 112.

Hỗ trợ trình duyệt

  • Chrome: 113.
  • Edge: 113.
  • Firefox: 112.
  • Safari: 17.2.

Lồng CSS

Chrome 112 hỗ trợ tính năng Lồng CSS, một tính năng được nhiều nhà phát triển mong đợi. Điều này sẽ giới thiệu một bộ chọn lồng mới >, dùng để lồng các quy tắc kiểu liên quan, theo cách quen thuộc với các nhà phát triển đã sử dụng trình xử lý trước:

.nesting {
  color: hotpink;

  > .is {
    color: rebeccapurple;

    > .awesome {
      color: deeppink;
    }
  }
}

Hỗ trợ trình duyệt

  • Chrome: 120.
  • Edge: 120.
  • Firefox: 117.
  • Safari: 17.2.

Nguồn

CSS animation-composition

Chrome 112 cũng hỗ trợ animation-composition. Tìm hiểu cách hoạt động của thuộc tính này trong phần Chỉ định cách nhiều hiệu ứng ảnh động kết hợp với thành phần ảnh động.

Hỗ trợ trình duyệt

  • Chrome: 112.
  • Edge: 112.
  • Firefox: 115.
  • Safari: 16.

Nguồn

Chế độ không có giao diện người dùng mới

Nếu bạn sử dụng chế độ Không có giao diện người dùng của Chrome, chẳng hạn như với Puppeteer, thì phiên bản 112 sẽ mang đến một chế độ Không có giao diện người dùng hoàn toàn mới. Tìm hiểu về tính năng này trong bài viết Chế độ không có giao diện người dùng của Chrome được nâng cấp.

Bản phát hành trình duyệt beta

Các phiên bản trình duyệt beta cho bạn xem trước những tính năng sẽ có trong phiên bản chính thức tiếp theo của trình duyệt. Đây là thời điểm thích hợp để thử nghiệm các tính năng mới hoặc các nội dung bị xoá có thể ảnh hưởng đến trang web của bạn trước khi chúng tôi phát hành bản cập nhật đó trên toàn cầu. Các bản thử nghiệm mới là Firefox 113 và Chrome 113, trong khi bản thử nghiệm Safari 16.5 vẫn đang diễn ra. Các bản phát hành này mang đến nhiều tính năng tuyệt vời cho nền tảng. Hãy xem ghi chú phát hành để biết tất cả thông tin chi tiết. Dưới đây là một số điểm nổi bật.

Firefox 113 bao gồm các hàm color(), lab(), lch(), oklab() và oklch(). Ngoài ra, còn có hàm color-mix() từ CSS Color 5 và thuộc tính forced-color-adjust.

Firefox cũng bao gồm cú pháp nth-child of <selector>, giúp bạn kiểm soát tốt hơn những phần tử mà bạn muốn chọn. Hãy đọc thêm trong phần Kiểm soát nhiều hơn đối với các lựa chọn :nth-child() bằng cú pháp of S.

Đối với CSS, Chrome 113 bao gồm các tính năng đa phương tiện overflow-inline, overflow-block và update. Cũng có trong hàm làm dịu linear() và loại image-set() không có tiền tố.

Chrome 113 cũng bao gồm WebGPU, phiên bản kế nhiệm của các API đồ hoạ WebGL và WebGL 2 cho Web. API này cung cấp các tính năng hiện đại như điện toán GPU, giảm mức hao tổn khi truy cập vào phần cứng GPU, khả năng kết xuất sang nhiều canvas từ một thiết bị đồ hoạ và hiệu suất tốt hơn, dễ dự đoán hơn.

Một phần của chương trình Mới làm quen với web