Dưới đây là những gì bạn cần phải biết:
- Chuyển đổi giữa nhiều tài liệu mới được hỗ trợ trong View Transitions API (API Chuyển đổi khung hiển thị).
- API CloseWatcher lại được cung cấp một lần nữa.
- API Gamepad hiện bao gồm trigger-rumble.
- Và còn nhiều tính năng khác.
Tôi là Adriana Jara. Hãy cùng tìm hiểu kỹ hơn và xem những tính năng mới dành cho nhà phát triển trong Chrome 126.
Chuyển đổi chế độ xem nhiều tài liệu cho các hoạt động điều hướng cùng nguồn gốc
View Transitions API (API Chuyển đổi khung hiển thị) cho phép bạn tạo các lượt chuyển đổi hình ảnh liền mạch giữa các khung hiển thị. Giờ đây, API này có sẵn theo mặc định cho các hoạt động điều hướng có cùng nguồn gốc. Trước đây, tính năng này chỉ có sẵn cho các cấu trúc ứng dụng trang đơn.
Để triển khai chuyển đổi chế độ xem nhiều tài liệu, cả hai bên đều cần chọn sử dụng. Để thực hiện việc này, hãy sử dụng quy tắc tại quy tắc chuyển đổi chế độ xem và đặt chỉ số mô tả điều hướng thành tự động.
Chuyển đổi chế độ xem nhiều tài liệu sử dụng cùng một thành phần và nguyên tắc như chuyển đổi chế độ xem cùng một tài liệu.
@view-transition {
navigation: auto;
}
Hãy xem bài viết Chuyển đổi mượt mà bằng View Transition API để biết thông tin chi tiết (xem nhiều ví dụ minh hoạ hơn).
Đã bật lại API CloseWatcher
Đối với các phần tử <dialog>
và popover=""
, API CloseWatcher giúp bạn xử lý các yêu cầu đóng dễ dàng hơn, chẳng hạn như phím ESC trên nền tảng máy tính hoặc cử chỉ quay lại trên Android.
Ban đầu, tính năng này được cung cấp trong Chrome 120 nhưng đã bị vô hiệu hoá do có tương tác không mong muốn với phần tử hộp thoại. Tính năng này đã được bật lại trong Chrome 126 sau khi được cải tiến để giảm thiểu các sự cố trước đó.
Để tìm hiểu cách sử dụng CloseWatcher, hãy truy cập bản minh hoạ của ứng dụng này.
Tiện ích mở rộng kích hoạt API Gamepad
Tính năng kích hoạt rumble hiện là một phần của Gamepad API. Nâng cao trải nghiệm chơi trò chơi trên web cho các tay điều khiển tương thích.
trigger-rumble
mở rộng GamepadHapticActuator
. Đây là giao diện đại diện cho phần cứng trong tay điều khiển được thiết kế để cung cấp phản hồi xúc giác cho người dùng (nếu có). trigger-rumble
cho phép các ứng dụng web sử dụng Gamepad API cũng rung kích hoạt của các thiết bị tay điều khiển đó.
Với mã sau đây, bạn có thể kiểm tra xem chức năng này có được hỗ trợ trong trình duyệt hay không và cách kích hoạt (nghĩa là chơi chữ)trigger-rumble
// This assumes a `Gamepad` as the value of the `gamepad` variable.
const triggerRumble = (gamepad, delay = 0, duration = 100, weak = 1.0, strong = 1.0) => {
if (!('vibrationActuator' in gamepad)) {
return;
}
// Feature detection.
if (!('effects' in gamepad.vibrationActuator) || !gamepad.vibrationActuator.effects.includes('trigger-rumble')) {
return;
}
gamepad.vibrationActuator.playEffect('trigger-rumble', {
// Duration in ms.
duration: duration,
// The left trigger (between 0 and 1).
leftTrigger: leftTrigger,
// The right trigger (between 0 and 1).
rightTrigger: rightTrigger,
});
};
Hãy xem bài viết Chơi trò chơi khủng long trên Chrome bằng tay điều khiển trò chơi để biết thêm thông tin về cách khai thác tối đa API Gamepad.
Và nhiều tính năng khác!
Tất nhiên, vẫn còn nhiều lý do khác.
GeolocationCoordinates
vàGeolocationPosition
hiện bao gồm phương thức.toJSON()
.Trong phần Cập nhật về DevTools, bạn có thể kiểm tra bộ chứa lưu trữ trong một cây chuyên dụng trong phần Application > Storage (Ứng dụng > Bộ nhớ).
ChromeOS hiện hỗ trợ chế độ thẻ cho ứng dụng web.
Tài liệu đọc thêm
Bài viết này chỉ bao gồm một số điểm nổi bật chính. Hãy truy cập vào các đường liên kết sau để biết thêm những thay đổi khác trong Chrome 126.
- Tính năng mới trong Công cụ của Chrome cho nhà phát triển (126)
- Thông tin cập nhật về ChromeStatus.com cho Chrome 126
- Danh sách thay đổi kho lưu trữ nguồn Chromium
- Lịch phát hành Chrome
Đăng ký
Để nắm bắt thông tin mới nhất, hãy đăng ký kênh YouTube dành cho Nhà phát triển Chrome. 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.
Chào Adriana Jara! Ngay sau khi Chrome 127 được phát hành, tôi sẽ luôn sẵn sàng cho bạn biết các tính năng mới của Chrome!