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

Sofia Emelianova
Sofia Emelianova
GitHub

Cải tiến 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.

Di chuyển và ẩn các bản nhạc bằng chế độ cấu hình bản nhạc mới cập nhật

Giờ bạn có thể chuyển sang chế độ cấu hình kênh bằng cách nhấp chuột phải vào tên kênh rồi chọn Định cấu hình kênh. Nút chỉnh sửa yêu cầu thêm không gian đã bị xoá.

Trước và sau khi thay thế nút chỉnh sửa bằng một tuỳ chọn trình đơn.

Chế độ cấu hình kênh cho phép bạn thay đổi thứ tự của các kênh và ẩn các kênh đó. Nhấp vào biểu tượng mũi tên lên hoặc mũi tên xuống để di chuyển bản nhạc hoặc nhấp vào biểu tượng ẩn. Để thoát khỏi chế độ cấu hình, hãy nhấp vào Hoàn tất việc định cấu hình kênh ở dưới cùng. Cấu hình này vẫn tồn tại cho các dấu vết mới nhưng không tồn tại cho các phiên DevTools tiếp theo.

Vấn đề về Chromium: 336266699.

Bỏ qua các tập lệnh trong biểu đồ hình ngọn lửa

Biểu đồ hình ngọn lửa trong kênh Main (Chính) hỗ trợ thêm danh sách bỏ qua. Bây giờ, bạn có thể nhấp chuột phải vào một tập lệnh trong biểu đồ rồi chọn Thêm tập lệnh vào danh sách bỏ qua.

Tuỳ chọn trình đơn để thêm tập lệnh vào danh sách bỏ qua, các tập lệnh được đánh dấu là bị bỏ qua và các quy tắc tương ứng trong phần Cài đặt.

Biểu đồ sẽ thu gọn các tập lệnh bị bỏ qua, đánh dấu các tập lệnh đó là On ignore list (Trong danh sách bỏ qua) và thêm các tập lệnh đó vào Custom exclusion rules (Quy tắc loại trừ tuỳ chỉnh) trong phần (cài đặt) Settings (Cài đặt) > Ignore list (Danh sách bỏ qua). Các tập lệnh đã bỏ qua sẽ được lưu cho đến khi bạn xoá chúng khỏi dấu vết hoặc khỏi Quy tắc loại trừ tuỳ chỉnh.

Vấn đề về Chromium: 336266714.

Giảm tốc CPU xuống 20 lần

Trình đơn điều tiết CPU (CPU) trong phần Capture settings (Cài đặt ghi lại) của bảng điều khiển Performance (Hiệu suất) có tùy chọn mới về khả năng làm chậm lại 20 lần. Do đó, giờ đây, bạn có thể tái tạo và phân tích chính xác hơn các vấn đề về hiệu suất trong thực tế, ngay cả trên máy tính cao cấp.

Trước và sau khi thêm tuỳ chọn "20xlowdonw" vào phần "Capture settings" (Cài đặt chụp).

Vấn đề về Chromium: 324978881.

Bảng thông tin chi tiết về hiệu suất sẽ ngừng hoạt động

Bảng điều khiển Thông tin chi tiết về hiệu suất thử nghiệm sẽ ngừng hoạt động vào năm 2024. Nhóm Công cụ cho nhà phát triển đang nỗ lực tích hợp các tính năng hữu ích nhất vào bảng điều khiển Hiệu suất. Giờ đây, bảng Thông tin chi tiết về hiệu suất sẽ hiển thị một biểu ngữ ở trên cùng để thông báo cho bạn về việc ngừng sử dụng sắp tới.

Biểu ngữ cảnh báo về việc ngừng sử dụng trong bảng "Thông tin chi tiết về hiệu suất".

Để tìm hiểu thêm, hãy xem bài viết Công cụ cải thiện hiệu suất cho năm 2024 trở đi.

Nếu bạn có ý kiến phản hồi về những điểm hiệu quả, những điểm chưa hiệu quả và những điểm bạn cho rằng chúng tôi có thể cải thiện, hãy cho chúng tôi biết.

Dán toàn bộ chuỗi tiêu đề để ghi đè các chuỗi đó

Khi ghi đè tiêu đề, giờ đây, bạn có thể dán toàn bộ chuỗi tiêu đề (HEADER_NAME: VALUE) và DevTools sẽ tách chuỗi tại : thành tên tiêu đề và giá trị của tiêu đề đó.

Xem ví dụ thực tế trong video sau.

Khi chỉnh sửa tiêu đề, bảng điều khiển Mạng hiện sẽ cảnh báo bạn nếu bạn nhập bất kỳ ký tự nào khác ngoài chữ-số, dấu gạch nối và dấu gạch dưới.

Cảnh báo bên cạnh tên tiêu đề có các ký tự không được hỗ trợ.

Ngoài ra, các tuỳ chọn trình đơn ghi đè và nút Chỉnh sửa sẽ bị tắt đối với URL chrome://, khớp với hành vi dự kiến.

Vấn đề về Chromium: 330967147, 337012362, 328210785.

Tìm mức sử dụng bộ nhớ quá mức bằng các bộ lọc mới trong ảnh chụp nhanh vùng nhớ khối xếp

Ảnh chụp nhanh của vùng nhớ khối xếp trong bảng Memory (Bộ nhớ) sẽ có các bộ lọc mới có thể giúp bạn tìm thấy những trường hợp sử dụng bộ nhớ không hiệu quả thường gặp, chẳng hạn như các chuỗi bị trùng lặp, đối tượng được các nút DOM tách rời và Bảng điều khiển Công cụ cho nhà phát triển giữ lại.

Tuỳ chọn trước và sau khi thêm bộ lọc cho các trường hợp phổ biến sử dụng bộ nhớ không hiệu quả.

Vấn đề về Chromium: 337094903.

Kiểm tra các bộ chứa bộ nhớ trong phần Application (Ứng dụng) > Storage (Bộ nhớ)

Giờ đây, 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 Ứng dụng > Bộ nhớ. Cây này (trước đây là thử nghiệm) đã được bật theo mặc định.

Trước và sau khi bật cây bộ chứa bộ nhớ trong phần Bộ nhớ.

Vấn đề về Chromium: 338094915.

Tắt cảnh báo tự XSS bằng cờ hiệu dòng lệnh

Nếu tự động hoá việc sử dụng Chrome hoặc mở DevTools từ dòng lệnh để gỡ lỗi, bạn thường sẽ muốn tắt cảnh báo tự XSS xuất hiện trong mỗi phiên DevTools mới.

Hộp thoại cảnh báo tự xss trong Bảng điều khiển.

Giờ đây, bạn có thể tắt hộp thoại này bằng cách chuyển cờ dòng lệnh --unsafely-disable-devtools-self-xss-warnings tới Chrome.

Vấn đề về Chromium: 41491762.

Lighthouse 12.0.0

Bảng điều khiển Lighthouse hiện chạy Lighthouse 12.0.0.

Bản cập nhật này mang đến một số thay đổi, bao gồm việc xoá danh mục PWA, sắp xếp lại danh mục SEO, Ngừng sử dụng Tiết kiệm tổng thể, các hoạt động kiểm tra mới và thay đổi về quy trình kiểm tra. Xem danh sách đầy đủ các thay đổi.

Để 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.

Thông tin 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:

  • Hiệu suất:
    • Chế độ cài đặt chụp chậm (Bật tính năng đo lường vẽ nâng cao và Bật số liệu thống kê về bộ chọn CSS) giờ đây sẽ tự động bị xoá trong phiên Công cụ cho nhà phát triển tiếp theo.
    • Thẻ Selector Stats (Số liệu thống kê về bộ chọn) hiện không tự động cuộn xuống dưới cùng khi bạn thu phóng biểu đồ hình ngọn lửa và dữ liệu thay đổi (337999939).
  • Bảng điều khiển: Giờ đây, phím tắt Ctrl+` sẽ đóng Bảng điều khiển trong ngăn nếu nó nằm trong tiêu điểm (40875466, 328210785).
  • Tự động điền: Khắc phục lỗi phân tích cú pháp địa chỉ (335409093, 335409707).
  • Hỗ trợ tiếp cận: Thông báo của trình đọc màn hình cho các chuỗi đã bản địa hoá là cố định (324930007).

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

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

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 mới, bản cập nhật hoặc bất cứ điều gì khác liên quan đến Công cụ cho nhà phát triển.

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

Danh sách mọi nội dung được đề cập trong loạt bài Tính năng mới trong Công cụ cho nhà phát triển.