Trang này được dịch bởi Cloud Translation API.

Tính năng mới trong Công cụ cho nhà phát triển, Chrome 125

Sofia Emelianova

Hiểu rõ hơn về các lỗi và cảnh báo trong Console nhờ Gemini

Phiên bản Chrome này cung cấp các tính năng dựa trên AI tạo sinh trong Bảng điều khiển Công cụ cho nhà phát triển, nhằm giúp bạn hiểu rõ hơn về những lỗi và cảnh báo mà bạn gặp phải.

Để xem nội dung giải thích về lỗi hoặc cảnh báo do AI tạo, hãy nhấp vào nút Tìm hiểu về lỗi này (cảnh báo) bên cạnh thông báo trong Bảng điều khiển rồi làm theo hướng dẫn.

Nội dung giải thích về một lỗi do AI tạo.

Để biết thêm thông tin, hãy xem bài viết Hiểu rõ hơn về lỗi và cảnh báo nhờ AI.

Hỗ trợ `@position-try` quy tắc trong Phần tử > Kiểu

Để giúp bạn gỡ lỗi vị trí neo CSS, thẻ Phần tử > Kiểu hiện hỗ trợ @position-try quy tắc CSS. Thẻ này phân giải các giá trị position-try-options và liên kết mỗi lựa chọn với một phần @position-try --name riêng.

Phần trước và sau khi hỗ trợ quy tắc CSS @Position-try.

Để tìm hiểu thêm, hãy xem bài viết Giới thiệu về API định vị quảng cáo cố định cuối màn hình CSS.

Vấn đề về Chromium: 40279608.

Cải tiến bảng điều khiển Nguồn

Phiên bản này có một số điểm cải tiến cho bảng điều khiển Sources (Nguồn).

Định cấu hình tự động in đẹp và đóng dấu ngoặc

Giờ đây, bạn có thể bật hoặc tắt tính năng tự động in đẹp và đóng dấu ngoặc cho Editor (Trình chỉnh sửa) trong phần Sources (Nguồn). Tính năng in đẹp giúp các tệp rút gọn có thể đọc được. Thao tác đóng dấu ngoặc sẽ tự động thêm dấu ngoặc đóng () hoặc }) hoặc thẻ (>) khi bạn nhập một dấu mở.

Để định cấu hình hoạt động có liên quan, hãy đánh dấu hoặc xóa các tùy chọn hộp kiểm Tự động đóng và check_box Tự động in nguồn rút gọn trong phần cài đặt Cài đặt > Lựa chọn ưu tiên > Nguồn.

Vấn đề về Chromium: 40865010, 324314570.

Lời hứa bị từ chối đã xử lý được ghi nhận là đã phát hiện được

Giờ đây, bảng điều khiển Nguồn nhận dạng chính xác các lời hứa bị từ chối là đã nắm bắt được nếu bạn xử lý các lời hứa đó bằng .catch() hoặc .then() hai đối số.

Nói cách khác, khi bật Nguồn > Điểm ngắt > check_box Tạm dừng khi các trường hợp ngoại lệ chưa nắm bắt, trình gỡ lỗi sẽ không tạm dừng đối với các câu lệnh tương tự như sau:

Promise.reject(new Error('fail')).catch((e)=>console.log('caught'));

Trước và sau khi nhận diện được trường hợp bị từ chối.

Vấn đề về Chromium: 40283993.

Nguyên nhân gây ra lỗi trong Bảng điều khiển

Giờ đây, Bảng điều khiển sẽ hiển thị cho bạn các chuỗi nguyên nhân lỗi trong dấu vết ngăn xếp, nếu có.

Để gỡ lỗi dễ dàng hơn, bạn có thể chỉ định nguyên nhân lỗi khi phát hiện và gửi lại lỗi. Khi Bảng điều khiển đi lên chuỗi nguyên nhân, bảng điều khiển sẽ in từng ngăn xếp lỗi với tiền tố Caused by:, do đó bạn vẫn có thể thấy lỗi ban đầu.

Dấu vết ngăn xếp trước và sau khi in có tiền tố "Nguyên nhân do".

Vấn đề về Chromium: 40182832.

Cải tiến về bảng điều khiển mạng

Phiên bản này có một số điểm cải tiến cho bảng điều khiển Mạng.

Kiểm tra tiêu đề Gợi ý ban đầu

Tiêu đề Gợi ý ban đầu sẽ có một phần riêng trong thẻ Tiêu đề của yêu cầu trên bảng điều khiển Mạng. Trước đây, bạn có thể tìm thấy các tiêu đề có liên quan trong phần Tiêu đề phản hồi.

Gợi ý sớm là một mã trạng thái HTTP (103 Early Hints) dùng để gửi phản hồi HTTP sơ bộ trước phản hồi cuối cùng. Điều này cho phép máy chủ gửi gợi ý cho trình duyệt về các tài nguyên phụ quan trọng (ví dụ: biểu định kiểu hoặc JavaScript quan trọng) hoặc nguồn gốc có thể được trang sử dụng, trong khi máy chủ đang bận tạo tài nguyên chính.

Phần trước và sau khi thêm một phần dành riêng cho Gợi ý ban đầu.

Để biết thêm thông tin, hãy xem phần Tải trang nhanh hơn nhờ tính năng thời gian suy nghĩ của máy chủ với tính năng Gợi ý ban đầu.

Vấn đề về Chromium: 40222701.

Ẩn cột Thác nước

Giờ đây, bạn có thể ẩn cột Thác nước trong bảng điều khiển Mạng tương tự như cách ẩn các cột khác. Nhấp chuột phải vào tên cột bất kỳ rồi bỏ chọn hộp đánh dấu check_box_outline_blank Thác nước trong trình đơn thả xuống.

Trước và sau khi thêm tuỳ chọn ẩn cột Thác nước.

Vấn đề về Chromium: 40574989.

Các điểm cải tiến về bảng điều khiển hiệu suất

Phiên bản này mang đến một số điểm cải tiến cho bảng điều khiển Hiệu suất.

Thu thập số liệu thống kê về bộ chọn CSS

Bảng điều khiển Hiệu suất có một chế độ cài đặt mới giúp bạn thu thập số liệu thống kê về bộ chọn CSS cho các sự kiện Tính toán lại kiểu dài hạn.

Để xem số liệu thống kê, hãy chọn sự kiện Tính toán lại kiểu và mở thẻ Số liệu thống kê về bộ chọn mới. Thẻ này hiển thị cho bạn thông tin về thời gian đã trôi qua, số lượt nhập và số lượt tìm nạp cũng như tỷ lệ phần trăm đường dẫn chậm không khớp với mỗi bộ chọn.

Số liệu thống kê trước và sau khi thêm bộ chọn.

Vấn đề về Chromium: 324282954.

Thay đổi thứ tự và ẩn bản nhạc

Bảng điều khiển Hiệu suất có chế độ cấu hình mới cho phép bạn thay đổi thứ tự của các bản nhạc và ẩn chúng.

Để chuyển sang chế độ cấu hình, hãy nhấp vào nút chỉnh sửa Edit ở bên trái tên bản nhạc. Sau đó nhấp vào arrow_upward lên hoặc arrow_downward xuống dưới để di chuyển tuyến đường hoặc nhấp vào visibility_off ẩn. Nhấp vào nút Xong Kiểm tra ở bên phải tên bản nhạc khi bạn hoàn tất.

Phiên bản tiếp theo, Chrome 126, sẽ có nhiều điểm cải tiến hơn cho giao diện người dùng này.

Vấn đề về Chromium: 311439339.

Bỏ qua các phần giữ lại trong bảng điều khiển Bộ nhớ

Giờ đây, bạn có thể bỏ qua các trình lưu giữ trong ảnh chụp nhanh vùng nhớ khối xếp mà bạn chụp bằng bảng điều khiển Memory (Bộ nhớ).

Để bỏ qua một trình lưu giữ, hãy chọn một đối tượng và trong phần Placeholder (Trình lưu giữ), hãy nhấp chuột phải vào một trình lưu giữ rồi chọn Ignore this keeper (Bỏ qua trình lưu giữ này) từ trình đơn thả xuống. Những thành phần giữ lại bị bỏ qua được đánh dấu bằng giá trị ignored trong cột Khoảng cách. Để dừng bỏ qua, hãy nhấp vào Khôi phục các trình lưu giữ bị bỏ qua trong thanh tác vụ ở trên cùng.

Trước và sau khi thêm tuỳ chọn bỏ qua phần giữ lại.

Ngoài ra, ảnh chụp nhanh vùng nhớ khối xếp hiện hỗ trợ số lượng lớn hơn (hàng trăm triệu) các cạnh và nút chứa vùng chứa (332350576).

Vấn đề về Chromium: 327337527.

Lighthouse 11.7.1

Bảng điều khiển Lighthouse hiện đã chạy Lighthouse 11.7.1. Xem danh sách đầy đủ các thay đổi.

Có một số thay đổi đáng chú ý là tính năng hỗ trợ trình bổ trợ Quảng cáo của nhà xuất bản đã ngừng hoạt động. Trình bổ trợ này đã lỗi thời trong phiên bản này.

Trước và sau khi thêm thành phần xoá hỗ trợ trình bổ trợ Quảng cáo của nhà xuất bản.

Để tìm hiểu thông tin cơ bản về cách sử dụng bảng điều khiển Lighthouse trong Công cụ cho nhà phát triển, hãy xem bài viết Lighthouse: Tối ưu hoá tốc độ trang web.

Vấn đề về Chromium: 772558.

Nội dung nổi bật khác

Dưới đây là một số nội dung sửa lỗi và cải tiến đáng chú ý trong bản phát hành này:

Bảng điều khiển Recorder (Máy ghi âm) hiện đã chính thức thoát khỏi trạng thái xem trước (329271496).
Bảng điều khiển hiện không hiển thị lỗi khi trình định dạng tuỳ chỉnh trả về null cho hàm body(). Đây là một hành vi hợp lệ (329400119).
Cụ thể, bảng điều khiển Sources (Nguồn) đã cập nhật công cụ đánh dấu cú pháp, cụ thể là giờ đây, công cụ này hỗ trợ cờ v và d trong biểu thức chính quy.
Thẻ Mạng > Cookie đã khắc phục một lỗi về việc liên kết cookie được miễn trừ với cookie phản hồi (41491846).
Giờ đây, thẻ Phần tử > Kiểu sẽ thực hiện những việc sau:
- Hiển thị các quy tắc kế thừa bị quá tải với các thuộc tính tuỳ chỉnh (41489874).
- Làm nổi bật giá trị đã áp dụng trong chế độ sáng-tối() tuỳ thuộc vào chủ đề màu sắc (331123816).

Tải kênh xem trước xuống

Hãy cân nhắc việc sử dụng Chrome Canary, Nhà phát triển hoặc Beta làm trình duyệt phát triển mặc định của bạn. Các kênh xem trước này cho phép bạn truy cập vào các tính năng mới nhất của Công cụ cho nhà phát triển, kiểm thử các API nền tảng web tiên tiến và tìm ra các vấn đề trên trang web của bạn trước khi người dùng làm điều đó!

Liên hệ với nhóm Công cụ của Chrome cho nhà phát triển

Sử dụng các lựa chọn sau để thảo luận về các tính năng và thay đổi mới trong bài đăng, hoặc bất cứ nội dung nào khác liên quan đến Công cụ cho nhà phát triển.

Gửi đề xuất hoặc phản hồi cho chúng tôi qua crbug.com.
Báo cáo sự cố trong Công cụ cho nhà phát triển bằng cách sử dụng Tuỳ chọn khác > Trợ giúp > Báo cáo vấn đề về Công cụ cho nhà phát triển trong Công cụ cho nhà phát triển.
Tweet tại @ChromeDevTools.
Để lại bình luận về Tính năng mới trong Video trên YouTube của Công cụ cho nhà phát triển hoặc Mẹo video trên YouTube trong Công cụ cho nhà phát triển.