Chrome 123 phiên bản thử nghiệm

Trừ khi có ghi chú khác, các thay đổi sau đây sẽ áp dụng cho bản phát hành mới nhất của kênh beta Chrome dành cho Android, ChromeOS, Linux, macOS và Windows. Tìm hiểu thêm về các tính năng được liệt kê tại đây thông qua các đường liên kết được cung cấp hoặc trong danh sách trên ChromeStatus.com. Chrome 123 đang ở giai đoạn thử nghiệm beta kể từ ngày 21 tháng 2 năm 2024. Bạn có thể tải phiên bản mới nhất xuống từ Google.com dành cho máy tính hoặc Cửa hàng Google Play trên Android.

CSS

Bản phát hành này bổ sung 5 tính năng CSS mới.

Hàm màu light-dark() của CSS

Hàm light-dark() trong CSS giúp nhà phát triển dễ dàng điều chỉnh giao diện màu theo lựa chọn ưu tiên của người dùng về chế độ sáng hoặc tối.

Sử dụng light-dark() để chỉ định hai giá trị màu khác nhau trong một thuộc tính CSS. Trình duyệt (hoặc thiết bị) sẽ tự động chọn màu phù hợp dựa trên giá trị color-scheme được tính toán của phần tử. Ví dụ: với CSS sau:

  • Nếu người dùng đã chọn giao diện sáng, phần tử .target sẽ có nền màu chanh.
  • Nếu người dùng đã chọn giao diện tối, phần tử .target sẽ có nền màu xanh lục.
html {
  color-scheme: light dark;
}
.target {
    background-color: light-dark(lime, green);
}

Chế độ hiển thị hình trong hình CSS

Thêm tính năng hỗ trợ cho tính năng đa phương tiện CSS display-mode cho giá trị picture-in-picture. Điều này cho phép các nhà phát triển web viết các quy tắc CSS cụ thể chỉ được áp dụng khi (một phần của) ứng dụng web hiển thị ở chế độ hình trong hình.

Tìm hiểu thêm về tính năng đa phương tiện này trong tài liệu về chế độ hình trong hình.

Thuộc tính CSS align-content cho các khối

Thuộc tính CSS align-content hiện được hỗ trợ trên vùng chứa khối và ô bảng. Trước đây, thuộc tính này chỉ được hỗ trợ trên các mục lưới và flex. Ví dụ: giờ đây, bạn có thể căn chỉnh display: block, display: list-itemdisplay: table-cell bằng align-content.

Tìm hiểu thêm trong phần Hỗ trợ align-content trong bố cục khối và bảng.

Thuộc tính CSS field-sizing

Khi sử dụng thuộc tính field-sizing, nhà phát triển có thể tắt kích thước mặc định cố định của các thành phần điều khiển biểu mẫu và đặt kích thước của các thành phần đó tuỳ thuộc vào nội dung. Điều này cung cấp một cách để tạo các trường văn bản tự động tăng trưởng.

Thuộc tính text-spacing-trim của CSS

Thuộc tính này áp dụng khoảng cách giữa các chữ cái cho các ký tự dấu câu tiếng Trung, tiếng Nhật và tiếng Hàn (CJK) để tạo ra kiểu chữ dễ nhìn như được xác định trong JLREQ (Yêu cầu đối với Bố cục văn bản tiếng Nhật) và CLREQ (Yêu cầu đối với Bố cục văn bản tiếng Trung).

Nhiều ký tự dấu câu CJK bao gồm khoảng cách bên trong ký tự. Ví dụ: dấu chấm và dấu ngoặc đơn đóng CJK thường có khoảng cách bên trong ký tự ở nửa bên phải của khoảng cách ký tự, để tạo khoảng cách nhất quán như các ký tự tượng hình khác. Nhưng khi các ký tự này xuất hiện trong một hàng, khoảng cách nội bộ của ký tự sẽ trở nên quá lớn. Tính năng này sẽ điều chỉnh khoảng cách thừa đó.

Thuộc tính text-spacing-trim chấp nhận một trong 4 giá trị sau: normal, trim-start, space-allspace-first. Tìm hiểu thêm trong bài viết Giới thiệu 4 tính năng quốc tế mới trong CSS.

API web

Cho phép tạo thông tin xác thực WebAuthn trong một iframe trên nhiều nguồn gốc

Tính năng này cho phép các nhà phát triển web tạo thông tin xác thực WebAuthn (tức là thông tin xác thực "publickey", còn gọi là khoá truy cập) trong các iframe trên nhiều nguồn gốc. Có hai điều kiện bắt buộc đối với khả năng mới này:

  • Iframe có chính sách quyền publickey-credentials-create-feature.
  • Iframe có hoạt động kích hoạt người dùng tạm thời.

Điều này sẽ cho phép nhà phát triển tạo khoá truy cập trong các trường hợp nhúng, chẳng hạn như sau quy trình xác thực nâng cao, trong đó Bên phụ thuộc đang cung cấp trải nghiệm xác thực liên kết.

Gói tính năng báo cáo phân bổ

Chrome 123 thêm tính năng tuỳ chỉnh dữ liệu điều kiện kích hoạt và bộ lọc giá trị tổng hợp vào API Báo cáo phân bổ tập trung vào:

  • Thêm khả năng định cấu hình API cho báo cáo cấp sự kiện bằng cách hỗ trợ tuỳ chỉnh số lượng giá trị và số lượng giá trị riêng biệt của dữ liệu điều kiện kích hoạt.
  • Thêm khả năng định cấu hình API cho báo cáo tóm tắt bằng cách hỗ trợ các bộ lọc trong giá trị tổng hợp.

Đo lường phân bổ trên web và ứng dụng

Mở rộng Attribution Reporting API để cho phép phân bổ lượt chuyển đổi diễn ra trên web cho các sự kiện diễn ra ngoài trình duyệt, trong các ứng dụng khác.

Đề xuất ở đây tận dụng tính năng hỗ trợ phân bổ ở cấp hệ điều hành. Cụ thể, API này cho phép nhà phát triển chọn cho phép các sự kiện trên web dành cho thiết bị di động có thể kết hợp với các sự kiện trong Hộp cát về quyền riêng tư của Android, mặc dù cũng có thể triển khai tính năng hỗ trợ cho các nền tảng khác.

blocking=render trên tập lệnh mô-đun cùng dòng

Đây là một thay đổi nhỏ giúp loại bỏ giới hạn nhân tạo khỏi <script blocking="render">. Trước khi có thay đổi này, <script blocking="render"type="module"> yêu cầu thuộc tính src, ngay cả khi src này là URI dữ liệu. Đây là một quy tắc ràng buộc không cần thiết, vì các tập lệnh mô-đun nội tuyến nhập các tập lệnh khác vẫn có thể hiển thị-khối.

Lý do là các hiệu ứng chuyển đổi chế độ xem trên nhiều tài liệu thường dựa vào các tập lệnh chặn kết xuất để tuỳ chỉnh. Vì vậy, việc tạo các tập lệnh chặn kết xuất dễ dàng hơn sẽ hỗ trợ tính năng này.

Chế độ hình trong hình của tài liệu: cho phép API focus() lấy tiêu điểm là trình mở

Giờ đây, bạn có thể sử dụng opener.focus() từ cửa sổ hình trong hình của tài liệu để đưa tiêu điểm cấp hệ thống vào thẻ sở hữu cửa sổ hình trong hình của tài liệu.

Điều này cho phép nhà phát triển đưa thẻ ban đầu trở lại nền trước khi cần. Ví dụ: khi người dùng cần truy cập vào một trải nghiệm giao diện người dùng không vừa với cửa sổ hình trong hình nhỏ hơn.

Cú pháp with của thuộc tính nhập

Thuộc tính nhập là một tính năng JavaScript cho phép chú thích các nội dung khai báo nhập, ví dụ: import xxx from "mod" with { type: "json" }. Ban đầu, Chrome đã phân phối phiên bản trước của đề xuất (trong Chrome 91) bằng cách sử dụng assert làm từ khoá. Sau đó, phiên bản này đã được cập nhật để sử dụng with do cần thực hiện một số thay đổi trong khi tích hợp với HTML cho các mô-đun JSON và CSS.

jitterBufferTarget

Thuộc tính jitterBufferTarget cho phép các ứng dụng chỉ định thời lượng mục tiêu của nội dung nghe nhìn tính bằng mili giây để bộ đệm độ trễ RTCRtpReceiver lưu giữ. Điều này ảnh hưởng đến lượng bộ đệm mà tác nhân người dùng thực hiện, từ đó ảnh hưởng đến việc truyền lại và khôi phục mất gói. Việc thay đổi giá trị mục tiêu cho phép các ứng dụng kiểm soát sự đánh đổi giữa độ trễ phát và rủi ro hết khung hình âm thanh hoặc video do độ trễ mạng.

Thời gian khung hình ảnh động dài

API Khung ảnh động dài là một phần mở rộng của API Tác vụ dài. Chỉ số này đo lường tác vụ cùng với bản cập nhật kết xuất tiếp theo, thêm thông tin như tập lệnh chạy trong thời gian dài, thời gian kết xuất và thời gian dành cho bố cục và kiểu buộc, được gọi là bố cục bị lỗi.

Nhà phát triển có thể sử dụng chỉ số này để chẩn đoán "sự chậm chạp" (được đo lường bằng INP) bằng cách tìm nguyên nhân gây ra tình trạng tắc nghẽn luồng chính, thường là nguyên nhân gây ra INP kém.

Giao diện NavigationActivation sẽ thêm navigation.activation. Thuộc tính này lưu trữ trạng thái về thời điểm Tài liệu hiện tại được kích hoạt (ví dụ: khi được khởi tạo hoặc khôi phục từ bộ nhớ đệm tiến/lùi).

Điều này có nghĩa là nhà phát triển có thể cung cấp các trang tuỳ chỉnh dựa trên vị trí người dùng truy cập. Ví dụ: chạy một ảnh động khác nếu người dùng đến từ trang chủ.

sự kiện pagereveal

Sự kiện pagereveal được kích hoạt trên đối tượng cửa sổ của Tài liệu ở cơ hội kết xuất đầu tiên sau khi Tài liệu được: tải ban đầu, khôi phục từ bộ nhớ đệm lui-tiến hoặc kích hoạt từ một lần kết xuất trước.

Tác giả trang có thể sử dụng thuộc tính này để thiết lập trải nghiệm truy cập vào trang, chẳng hạn như chuyển đổi chế độ xem từ trạng thái trước đó.

PointerEvent.deviceId cho tính năng Viết bằng nhiều bút

Khi các thiết bị có khả năng nhập bằng bút cảm ứng ngày càng phổ biến, điều quan trọng là nền tảng web phải tiếp tục phát triển để hỗ trợ đầy đủ các tính năng nâng cao này nhằm mang lại trải nghiệm phong phú cho cả người dùng cuối và nhà phát triển. Một trong những tiến bộ đó là khả năng của bộ chuyển đổi số của thiết bị nhận ra nhiều thiết bị bút tương tác với thiết bị đó cùng một lúc. Tính năng này là một phần mở rộng của giao diện PointerEvent để bao gồm một thuộc tính mới, deviceId, đại diện cho một giá trị nhận dạng duy nhất, riêng biệt với tài liệu, tồn tại trong phiên mà nhà phát triển có thể sử dụng một cách đáng tin cậy để xác định từng bút cảm ứng tương tác với trang.

Kiểm tra quyền truy cập mạng riêng cho các yêu cầu điều hướng: chế độ chỉ cảnh báo

Trước khi trang web A chuyển đến một trang web B khác trong mạng riêng tư của người dùng, tính năng này sẽ thực hiện những việc sau:

  1. Kiểm tra xem yêu cầu có được bắt đầu từ một ngữ cảnh an toàn hay không.
  2. Gửi yêu cầu trước khi kiểm tra và kiểm tra xem B có phản hồi bằng tiêu đề cho phép truy cập mạng riêng tư hay không.

Đã có các tính năng cho tài nguyên phụ và worker, nhưng tính năng bổ sung này là dành riêng cho các yêu cầu điều hướng.

Các bước kiểm tra này được thực hiện để bảo vệ mạng riêng của người dùng. Vì tính năng này là chế độ "chỉ cảnh báo", nên tính năng này sẽ không từ chối các yêu cầu nếu có bất kỳ quy trình kiểm tra nào không thành công. Thay vào đó, một cảnh báo sẽ xuất hiện trong DevTools để giúp nhà phát triển chuẩn bị cho việc thực thi sắp tới.

Gợi ý cho ứng dụng Sec-CH-UA-Form-Factor

Gợi ý này cho biết "hệ số hình dạng" của tác nhân người dùng hoặc thiết bị để trang web có thể điều chỉnh phản hồi.

API định tuyến tĩnh của Worker dịch vụ

API này cho phép nhà phát triển định cấu hình định tuyến và cho phép họ giảm tải các thao tác đơn giản mà worker dịch vụ thực hiện. Nếu điều kiện khớp, thao tác điều hướng sẽ diễn ra mà không cần khởi động worker dịch vụ hoặc thực thi JavaScript, cho phép các trang web tránh bị phạt về hiệu suất do worker dịch vụ chặn. Để biết thêm thông tin, hãy xem bài đăng trước trên blog về API này.

Cập nhật về Bộ nhớ dùng chung

Bản cập nhật này hỗ trợ chạy các worklet trên nhiều nguồn gốc mà không cần tạo iframe.

Mã hoá nội dung zstd

Zstandard (hay zstd) là một cơ chế nén dữ liệu được mô tả trong RFC8878. Đây là một thuật toán nén không tổn hao nhanh chóng, nhắm đến các trường hợp nén theo thời gian thực ở cấp zlib và tỷ lệ nén tốt hơn. Mã thông báo zstd được thêm dưới dạng mã thông báo Nội dung-Mã hoá do IANA đăng ký.

Việc thêm tính năng hỗ trợ zstd dưới dạng Content-Encoding sẽ giúp tải trang nhanh hơn và sử dụng ít băng thông hơn, đồng thời giảm thời gian, CPU và điện năng để nén trên máy chủ, từ đó giảm chi phí máy chủ.

Bản dùng thử theo nguyên gốc mới

Trong Chrome 123, bạn có thể chọn tham gia các bản dùng thử mới về nguồn gốc sau đây.

Tích hợp lời hứa JavaScript WebAssembly

Để hỗ trợ các ứng dụng thích ứng được viết bằng WebAssembly, bạn cần cung cấp các tính năng cho phép tạm ngưng và tiếp tục các chương trình WebAssembly.

Trường hợp sử dụng ban đầu chính của tính năng tích hợp lời hứa là cho phép các chương trình WebAssembly có nguồn dựa vào API đồng bộ sử dụng API không đồng bộ ngày càng phổ biến trên nền tảng Web.

Đăng ký dùng thử nguồn gốc tích hợp lời hứa.

Xoá

Chrome 123 sẽ xoá tính năng sau.

Bí danh window-placement cho quyền và chính sách quyền window-management

Trong Chrome 111, window-management đã được thêm vào làm bí danh cho quyền window-placement và chuỗi chính sách quyền. Đây là một phần trong nỗ lực lớn hơn nhằm đổi tên các chuỗi bằng cách ngừng sử dụng và xoá window-placement. Thay đổi về thuật ngữ giúp tăng thời gian hoạt động của chỉ số mô tả khi Window Management API phát triển theo thời gian.

Cảnh báo ngừng sử dụng cho bí danh window-placement bắt đầu xuất hiện trong Chrome 113 và giờ đây sẽ bị xoá.