Tính năng mới trong Chrome 97

Pete LePage

Dưới đây là những gì bạn cần phải biết:

Chúc mừng năm mới! Tôi là Pete LePage. Hãy cùng tìm hiểu những tính năng mới dành cho nhà phát triển trong Chrome 97.

Web Transport

Nếu bạn đang sử dụng Web Sockets hoặc API Kênh dữ liệu WebRTC để gửi thông báo giữa máy chủ và trang, thì bạn có một lựa chọn mới. WebTransport là một API mới cung cấp thông báo hai chiều, có độ trễ thấp và máy chủ máy khách.

API này có độ trễ thấp hơn WebSocket và không giống như API Kênh dữ liệu RTC được thiết kế để nhắn tin ngang hàng, API Truyền tải web được thiết kế riêng cho việc nhắn tin máy khách-máy chủ.

API này hỗ trợ gửi dữ liệu một cách đáng tin cậy với API luồng và API gói dữ liệu một cách không đáng tin cậy. Phương thức này được hỗ trợ trong trình chạy web. Và vì hiển thị giao diện tuân thủ Luồng, nên lớp này hỗ trợ các hoạt động tối ưu hoá liên quan đến áp lực ngược.

Để sử dụng Dịch vụ này, bạn cần một máy chủ hỗ trợ HTTP/3, thường dễ hơn so với việc thiết lập và duy trì máy chủ WebRTC. Mở một thực thể WebTransport mới, chờ thực thể đó kết nối và bạn có thể bắt đầu gửi dữ liệu.

const url = 'https://example.com:4999/foo/bar';
const transport = new WebTransport(url);
await transport.ready;

const writer = transport.datagrams.writable.getWriter();
const data1 = new Uint8Array([65, 66, 67]);
writer.write(data1);

Hãy xem bài viết Thử nghiệm với WebTransport trên web.dev để biết thông tin đầy đủ.

Phát hiện tính năng loại tập lệnh

Hôm nay, chúng ta có thể sử dụng thuộc tính nomodule để phát hiện tính năng hỗ trợ cho các mô-đun JavaScript trong trình duyệt. Tuy nhiên, sẽ có một số đề xuất mới về tính năng trong quy trình, chẳng hạn như bản đồ nhập, quy tắc suy đoán và tải trước gói. Chúng ta cần một cách để biết trình duyệt hỗ trợ gì.

Nhập HTMLScriptElement.supports(). Bạn có thể sử dụng thuộc tính này để xác định loại tập lệnh bạn có thể sử dụng và gửi cho trình duyệt tuỳ chọn tốt nhất.

if (HTMLScriptElement.supports('importmap')) {
  // Use <script type="importmap" ...>
} else if (HTMLScriptElement.supports('module')) {
  // Use <script type="module" ...>
} else {
  // Use classic method...
}

Mẫu nguyên mẫu mảng mới

Tôi rất thích khi JavaScript trở nên dễ dàng hơn. Array và TypedArray hiện hỗ trợ các phương thức tĩnh findLast() và findLastIndex().

Các hàm này hoạt động hiệu quả giống như find() và findIndex(), nhưng tìm kiếm từ cuối mảng thay vì đầu mảng.

Ví dụ: để tìm số cuối cùng trong một mảng lớn hơn 10, hãy gọi findLast() bằng một hàm kiểm thử để kiểm tra xem giá trị có lớn hơn 10 hay không.

const array1 = [5, 12, 8, 130, 44, 3, 6];

function greaterThanTen(val) {
  return val > 10;
}

const last = array1.findLast(greaterThanTen);
// 44

const lIdx = array1.findLastIndex(greaterThanTen);
// 4

Mô phỏng Chrome 100 trong chuỗi UA

Chỉ trong vài tháng nữa, chúng tôi sẽ ra mắt Chrome 100, phiên bản có số ba chữ số. Bạn nên chọn mọi mã kiểm tra số phiên bản hoặc phân tích cú pháp chuỗi UA để đảm bảo xử lý được 3 chữ số.

Có một cờ có tên là #force-major-version-to-100 sẽ thay đổi số phiên bản hiện tại thành 100, nhờ đó bạn có thể đảm bảo mọi thứ hoạt động như mong đợi.

Trang cờ Chrome làm nổi bật tuỳ chọn #force-major-version-to-100 mới

Và nhiều tính năng khác!

Tất nhiên còn nhiều tính năng khác.

Các dòng mới trong các mục nhập biểu mẫu hiện được chuẩn hoá theo cách tương tự như Gecko và WebKit, giúp cải thiện khả năng tương tác giữa các trình duyệt.

Chúng tôi đang chuẩn hoá tên gợi ý ứng dụng bằng cách thêm tiền tố sec-ch vào tên. Ví dụ: dpr trở thành sec-ch-dpr. Chúng tôi sẽ tiếp tục hỗ trợ các phiên bản hiện có của các gợi ý này, nhưng bạn nên lên kế hoạch để ngừng sử dụng và xoá các gợi ý này.

Các phần tử <details> đóng hiện có thể tìm kiếm được và có thể được liên kết. Các phần tử ẩn này sẽ tự động mở rộng khi bạn sử dụng tính năng tìm trong trang, ScrollToTextFragment và điều hướng mảnh phần tử.

Tài liệu đọc thêm

Nội dung này chỉ đề cập đến một số điểm nổi bật chính. Hãy truy cập các đường liên kết bên dưới để biết các thay đổi khác trong Chrome 97.

Đăng ký

Để cập nhật thông tin, hãy đăng ký kênh YouTube dành cho nhà phát triển Chrome và bạn sẽ nhận được thông báo qua email mỗi khi chúng tôi ra mắt video mới.

Tôi là Pete LePage. Ngay khi Chrome 98 được phát hành, tôi sẽ quay lại đây để giới thiệu cho bạn những tính năng mới trong Chrome!