Hãy khám phá một số tính năng thú vị có trên trình duyệt web ổn định và phiên bản thử nghiệm trong tháng 6 năm 2022.
Bản phát hành trình duyệt ổn định
Vào tháng 6, Chrome 103 và Firefox 102 đã trở nên ổn định.
Biến đổi luồng và luồng byte có thể đọc được
Firefox 102 bao gồm tính năng hỗ trợ cho Transform Streaming (Chuyển đổi luồng). Thao tác này sẽ bật đường ống từ ReadableStream
đến WritableStream
, thực thi phép biến đổi trên các đoạn. Thật tuyệt khi tính năng này hoạt động trên cả ba công cụ, giúp đây là thời điểm rất phù hợp để tìm hiểu về Luồng.
Các luồng byte có thể đọc hiện cũng được hỗ trợ trong Firefox 102, cho phép trình đọc BYOB (mang bộ đệm của riêng bạn) qua giao diện ReadableStreamBYOBReader
. Bạn có thể dùng dịch vụ này để truyền trực tuyến dữ liệu do nhà phát triển cung cấp.
Truy cập phông chữ được cài đặt trên máy
Chrome 103 bao gồm API Truy cập phông chữ cục bộ, cho phép truy cập vào phông chữ được cài đặt trên máy của người dùng. Sau khi yêu cầu quyền truy cập vào các phông chữ đã cài đặt trên thiết bị, hãy gọi window.queryLocalFonts()
để nhận một dãy các phông chữ đã cài đặt.
const pickedFonts = await window.queryLocalFonts();
for (const fontData of pickedFonts) {
console.log(fontData.postscriptName);
console.log(fontData.fullName);
console.log(fontData.family);
console.log(fontData.style);
}
Tính năng đa phương tiện update
Firefox 102 có tính năng đa phương tiện update
. Thuộc tính này dùng để truy vấn xem thiết bị đầu ra có thể sửa đổi giao diện của nội dung sau khi kết xuất hay không.
Mã trạng thái HTTP mới – 103 gợi ý sớm
Chrome 103 thêm mã trạng thái mới HTTP 103 Gợi ý sớm. Nếu máy chủ hoặc CDN biết rằng cần có một nhóm tài nguyên phụ nhất định để tải trang, thì trình duyệt có thể khuyên trình duyệt nên kết nối trước với các nguồn gốc hoặc thậm chí là tải trước tài nguyên khi trang yêu cầu các tài nguyên đó đến. Để tận dụng tính năng này, bạn cần cập nhật máy chủ hoặc CDN của mình (hãy tìm hiểu thêm về tính năng Gợi ý sớm).
Bản phát hành trình duyệt beta
Phiên bản trình duyệt beta cho phép bạn xem trước những nội dung sẽ có trong phiên bản ổn định 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 xoá bỏ những tính năng có thể ảnh hưởng đến trang web của bạn trước khi toàn thế giới ra mắt bản phát hành đó.
Các phiên bản thử nghiệm mới trong tháng 4 là Chrome 104, Firefox 103 và Safari 16.
Cú pháp mới cho truy vấn phương tiện phạm vi
Chrome 104 cung cấp cú pháp mới cho truy vấn nội dung nghe nhìn theo phạm vi, trong đó có phần thông số kỹ thuật về Truy vấn nội dung nghe nhìn cấp 4. Ví dụ: một truy vấn đa phương tiện trước đây đã được viết như sau:
@media (min-width: 400px) { … }
Bây giờ, bạn có thể viết như sau:
@media (width >= 400px) { … }
API Khu vực
Chrome 104 trên máy tính cũng có API thu thập khu vực. Tính năng này cho phép cắt và xoá nội dung khỏi video đã quay trước khi chia sẻ.
Safari 16 mang đến một số tính năng chính cho trình duyệt
Safari 16 có vẻ là một bản phát hành thú vị khác của nhóm Safari. Bản phát hành này bổ sung nhiều tính năng có trong Interop 2022. Thật tuyệt khi thấy nhiều tính năng xuất hiện vào thời điểm giữa năm này. Tôi sẽ nêu bật một số tính năng yêu thích của mình ở đây, nhưng hãy xem ghi chú phát hành để biết thêm thông tin.
Cùng với nhiều nhà phát triển, tôi thực sự rất vui mừng khi thấy các truy vấn kích thước hỗ trợ cho Truy vấn vùng chứa, một tính năng hiện cũng đã được ra mắt trong Chrome.
Ngoài ra, trong Safari 16, giá trị subgrid
cho grid-template-columns
và grid-template-rows
cũng được hỗ trợ. Tính năng này đã có trong Firefox và đang được phát triển trên Chrome, đồng thời cho phép các lưới lồng nhau kế thừa kích thước đường lưới.
Ngoài ra, đối với bố cục lưới là khả năng tạo ảnh động cho đường theo lưới.
Hỗ trợ trình duyệt
- 107
- 107
- 66
- 16
Phương thức showPicker()
, cho phép một cách chính tắc để hiển thị bộ chọn ngày, giờ, màu sắc và tệp trong trình duyệt. Bạn có thể tìm hiểu thêm về điều này trong phần hiển thị bộ chọn ngày, giờ, màu sắc và tệp của trình duyệt.
Các vấn đề về hỗ trợ tiếp cận cho display: contents
cũng đã được giải quyết, giúp tính năng hữu ích này an toàn khi sử dụng mà không có nguy cơ phải xoá các phần tử khỏi cây hỗ trợ tiếp cận.
Các tính năng beta này sẽ sớm ra mắt trên các trình duyệt ổn định.
Một phần trong loạt video New to the web Series