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

Matthias Rohmer

Published: April 7, 2026

Chrome 147 giới thiệu tính năng tự động chọn ngữ cảnh cho công cụ trợ giúp AI, nâng cấp tính năng đề xuất mã thành tính năng hoàn thành mã đầy đủ, hiện đại hoá thanh công cụ Chế độ thiết bị, mang đến tính năng tự động giải mã các phần nội dung mạng đã nén và một số tính năng nâng cao khác.

Tính năng tự động chọn ngữ cảnh trong công cụ trợ giúp AI

Màn hình bắt đầu của bảng trợ giúp AI mới.

Một trong những tính năng được yêu cầu nhiều nhất đối với công cụ trợ giúp AI là khả năng đặt các câu hỏi mở hơn. Giờ đây, một tác nhân chọn ngữ cảnh mới cho phép bạn đặt câu hỏi mà không cần chọn ngữ cảnh trước, ví dụ:

  • "What are the slowest network requests on this page?" Trước đây, bạn không thể làm việc này vì phải chọn một yêu cầu mạng cụ thể.
  • "What performance issues exist on the page?" Giờ đây, Công cụ cho nhà phát triển sẽ tự động ghi lại dấu vết bằng các chế độ cài đặt bạn đã chọn để trả lời câu hỏi này.
  • "How do I use the animation panel?" or "Where is the high contrast setting in DevTools?", cung cấp trợ giúp trực tiếp cho chính Công cụ cho nhà phát triển.

Trong lần thay đổi này, công cụ trợ giúp AI cũng có thể tự động chuyển đổi ngữ cảnh. Công cụ này sẽ cập nhật ngữ cảnh một cách thông minh dựa trên các hành động của bạn khi cuộc trò chuyện trống, đồng thời tôn trọng các lựa chọn thủ công của bạn sau khi cuộc trò chuyện bắt đầu.

Công cụ cho nhà phát triển dành cho tác nhân

Máy chủ và CLI MCP của Chrome DevTools đã được cập nhật lên phiên bản 0.21.0, mang đến những cải tiến đáng kể cho quy trình làm việc nhiều tác nhân, các tính năng kiểm tra mới thông qua Lighthouse và một bộ kỹ năng nâng cao.

Các tính năng chính được thêm vào kể từ lần cập nhật gần đây nhất bao gồm:

  • Kiểm tra Lighthouse tích hợp: Giờ đây, bạn có thể chạy các cuộc kiểm tra Lighthouse trực tiếp thông qua MCP, cho phép kiểm tra tự động hiệu suất và chất lượng trong quy trình làm việc của tác nhân.
  • Kỹ năng phát hiện rò rỉ bộ nhớ: Đã thêm một kỹ năng mới để phát hiện rò rỉ bộ nhớ bằng công cụ take_memory_snapshot.
  • Cải thiện kỹ năng hỗ trợ tiếp cận: Kỹ năng gỡ lỗi hỗ trợ tiếp cận đã được tinh chỉnh để tận dụng tốt hơn Lighthouse và cung cấp kết quả mạnh mẽ hơn.
  • Kỹ năng sử dụng chung: Các kỹ năng chuyên dụng về cách sử dụng máy chủ MCP của Công cụ cho nhà phát triển của Chrome hoặc CLI và cách khắc phục sự cố cài đặt giúp tác nhân tận dụng tối đa Công cụ cho nhà phát triển dành cho tác nhân.
  • Hỗ trợ quy trình làm việc nhiều tác nhân: Việc giới thiệu tính năng định tuyến pageId cho phép nhiều tác nhân nhắm mục tiêu và tương tác chính xác với các trang trình duyệt cụ thể song song.

Để bắt đầu sử dụng các tính năng này, hãy xem kho lưu trữ GitHub có ghi chú phát hành chi tiết.

Tạo mã

Trong Chrome 142, chúng tôi đã giới thiệu tính năng đề xuất mã của Gemini trong bảng điều khiển và bảng điều khiển Nguồn. Với Chrome 147, tính năng này được nâng cấp thành tính năng tạo mã đầy đủ.

Để tạo mã, hãy nhập một nhận xét bằng ngôn ngữ tự nhiên mô tả logic bạn cần (ví dụ: // Loop to check all img elements for valid alt attributes) rồi nhấn Cmd+I (Mac) hoặc Ctrl+I (Windows/Linux) để bắt đầu tạo.

Thanh công cụ Chế độ thiết bị được làm mới

Thanh công cụ Chế độ thiết bị đã được hiện đại hoá để mang lại trải nghiệm nhất quán và tinh gọn hơn:

  • Các nút điều khiển được tiêu chuẩn hoá: Lựa chọn thiết bị, mức thu phóng và Tỷ lệ pixel của thiết bị (DPR) hiện sử dụng các thành phần giao diện người dùng tiêu chuẩn của Công cụ cho nhà phát triển, giúp cải thiện khả năng sử dụng.
  • Thu phóng tinh gọn: Trình đơn thu phóng hiện rõ ràng hơn, với lựa chọn "Fit to window" (Vừa với cửa sổ) được tích hợp trực tiếp vào danh sách phần trăm. Tính năng "Auto-adjust zoom" (Tự động điều chỉnh mức thu phóng) đã được chuyển sang nút thanh công cụ chuyên dụng riêng.
  • Hỗ trợ khoá hướng: Giờ đây, Công cụ cho nhà phát triển xử lý API screen.orientation.lock() trong tính năng mô phỏng thiết bị. Khi một trang khoá hướng, thiết bị được mô phỏng sẽ tự động xoay để khớp với hướng đã khoá và nút xoay thủ công sẽ bị tắt khi khoá đang hoạt động.

Vấn đề về Chromium: 40807290

Giải mã các phần nội dung đã nén

Giờ đây, việc chẩn đoán các vấn đề với tài nguyên đã nén trở nên dễ dàng hơn nhiều. Trước đây, nếu một yêu cầu HTTP sử dụng Content-Encoding: gzip hoặc deflate, thì chế độ xem Payload (Tải trọng) trong bảng điều khiển Network (Mạng) sẽ hiển thị dữ liệu nhị phân bị xáo trộn thay vì nội dung đã giải mã.

Trong Chrome 147, Công cụ cho nhà phát triển sẽ tự động giải mã các phần nội dung đã nén này, hiển thị nội dung có thể đọc được trực tiếp trong Payload (Tải trọng).

Ngoài ra, danh sách yêu cầu hiện bao gồm thông tin Transfer Size (Kích thước chuyển), cung cấp hình ảnh rõ ràng hơn về việc sử dụng dữ liệu qua mạng – một thông tin chi tiết cũng được trợ lý AI sử dụng để chọn yêu cầu tốt hơn.

Vấn đề về Chromium: 356158096

Bộ lọc biểu thức chính quy cho kiểu

Bộ lọc biểu thức chính quy mới trong bảng Kiểu.

Giờ đây, bạn có thể sử dụng biểu thức chính quy trong các thanh bộ lọc cho bảng điều khiển Styles (Kiểu), Computed (Đã tính toán) và Properties (Thuộc tính). Nhấp vào nút chuyển đổi Biểu thức chính quy mới (.*) để bật. Sau đó, ví dụ: nhập padding|border để làm nổi bật tất cả các thuộc tính padding và border.

Vấn đề về Chromium: 40706727

Cải tiến tính năng tải theo suy đoán

Tính năng gỡ lỗi tải trước mạnh mẽ hơn với các tính năng mới trong bảng điều khiển Application (Ứng dụng) > Speculative loads (Tải theo suy đoán):

  • Lọc văn bản: Giờ đây, bạn có thể lọc danh sách quy tắc và lượt thử bằng văn bản tự do hoặc bộ lọc có khoá (ví dụ: url:, action:, status:), có hỗ trợ logic AND giữa nhiều cụm từ.
  • Nút Xoá: Nút xoá mới cho phép bạn đặt lại mô hình tải trước và xoá các quy tắc và lượt thử được hiển thị.
  • Mã trạng thái HTTP: Đối với các lần tìm nạp trước không thành công, Công cụ cho nhà phát triển hiện hiển thị mã trạng thái HTTP thực tế (ví dụ: 404) trong cả cột trạng thái và ngăn chi tiết, thay vì thông báo lỗi chung.

Vấn đề về Chromium: 479524246, 40926909

Khác

Sau đây là một số bản sửa lỗi và tính năng đáng chú ý trong bản phát hành này:

  • Console (Bảng điều khiển): Khi tất cả các khung ngăn xếp nội tuyến của một lỗi đều nằm trong danh sách bỏ qua nhưng ngăn xếp lệnh gọi chứa các khung không bị bỏ qua, thì một nút chuyển đổi sẽ xuất hiện để giúp bạn tập trung vào mã có thể thực hiện được trong khi ẩn các dấu vết thư viện gây nhiễu (379788109).
  • Performance (Hiệu suất): Trạng thái thanh bên (mở/đóng) hiện được duy trì; nếu bạn đóng thanh bên, thì thanh bên sẽ vẫn đóng trong các bản ghi tiếp theo (437340219).
  • Settings (Cài đặt): Giờ đây, Công cụ cho nhà phát triển có thể nhắc bạn khởi động lại trình duyệt thông qua một thanh thông tin khi chuyển đổi một số chế độ cài đặt thử nghiệm.
  • Object Inspection (Kiểm tra đối tượng): Lựa chọn trình đơn theo bối cảnh "Show all" (Hiển thị tất cả) mới trong chế độ xem đối tượng cho phép bạn chuyển đổi khả năng hiển thị của các thuộc tính nullish (null hoặc undefined) (41187256).
  • Elements (Phần tử): Trình trang trí "ad" (quảng cáo) không còn bị giới hạn ở iframe và giờ đây có thể hiển thị cho các phần tử tuỳ ý được phần phụ trợ gắn thẻ là có liên quan đến quảng cáo (485493202).
  • Instruction nodes (Nút hướng dẫn): Giờ đây, các nút Hướng dẫn xử lý (như <?xml-stylesheet ... ?>) có thể nhìn thấy và chỉnh sửa trong cây DOM (484891675)

Hỗ trợ tiếp cận

Bản phát hành này mang đến một số cải tiến về khả năng hỗ trợ tiếp cận:

  • Hiệu suất: Nút trợ giúp tiêu đề trong thẻ chỉ số hiệu suất hiện luôn hiển thị và có thể truy cập bằng bàn phím, thay vì chỉ xuất hiện khi di chuột (487613506).
  • Sources (Nguồn): Giờ đây, bạn có thể đánh dấu hoặc bỏ đánh dấu các điểm dừng của trình nghe sự kiện bằng phím Space (4788890182).
  • Settings (Cài đặt): Giờ đây, các phím Home và End hoạt động để di chuyển đến mục đầu tiên và mục cuối cùng của danh sách phím tắt (481747256).
  • Lighthouse: Cải thiện thông báo của trình đọc màn hình cho nhóm danh mục hộp kiểm (477643909).