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

Matthias Rohmer

Trong Chrome 144, nhóm đã ra mắt một tính năng được mong đợi từ lâu cho máy chủ MCP của Công cụ cho nhà phát triển Chrome, đó là bảng Điều kiện yêu cầu mới và các điểm cải tiến để gỡ lỗi phông chữ và biểu định kiểu được áp dụng.

Đây là danh sách các tính năng đáng chú ý mà chúng tôi đã ra mắt trong năm 2025. Bạn có muốn xem mình có bỏ lỡ thông báo nào không? Sau đó, hãy xem các điểm nổi bật sau đây hoặc duyệt qua các bản phát hành trước đây của phần Có gì mới trong Công cụ cho nhà phát triển.

Nội dung cập nhật về máy chủ MCP của Công cụ cho nhà phát triển

Chúng tôi đã khắc phục nhiều lỗi cho máy chủ MCP của Công cụ cho nhà phát triển và phát hành phiên bản 0.12.1. Phiên bản này giới thiệu một tính năng mới quan trọng là tự động kết nối, cho phép bạn sử dụng lại một phiên trình duyệt hiện có. Với tính năng tự động kết nối, bạn có thể tự bắt đầu gỡ lỗi trong Chrome, sau đó trỏ MCP của Công cụ cho nhà phát triển đến cùng một phiên bản Chrome để tiếp tục từ nơi bạn dừng lại.

Tìm hiểu thêm về tính năng tự động kết nối cho MCP của Công cụ cho nhà phát triển trong bài đăng có liên quan trên blog. Hãy xem nhật ký công khai về các thay đổi trên GitHub để biết danh sách đầy đủ các thay đổi và bản sửa lỗi.

Hạn chế băng thông mạng cho từng yêu cầu

Bảng điều khiển Chặn yêu cầu kết nối mạng đã được đổi tên thành Điều kiện yêu cầu. Ngoài việc chặn các yêu cầu, giờ đây, bảng điều khiển này cũng cho phép bạn điều tiết các yêu cầu riêng lẻ.

Mở bảng điều khiển này bằng cách chọn ⋮ > Công cụ khác > Điều kiện yêu cầu. Bật/tắt hộp đánh dấu Bật tính năng chặn và điều tiết để bật tính năng chặn yêu cầu. Nhấp vào nút + để thêm một mẫu văn bản mới. Nhấp vào biểu tượng để loại bỏ tất cả các quy tắc.

Tìm hiểu cách điều chỉnh tốc độ của từng yêu cầu mạng trong tài liệu mới cập nhật.

Chỉnh sửa các quy tắc @font-face và @font-feature-values

@font-face và @font-feature-values hiện xuất hiện trong bảng điều khiển Kiểu và có thể chỉnh sửa từ đó.

Biểu định kiểu được áp dụng trong bảng điều khiển Phần tử

Giờ đây, bảng Elements (Phần tử) sẽ cho thấy các biểu định kiểu được áp dụng trong các gốc bóng và gốc tài liệu. Điều này giúp những người làm việc với biểu định kiểu được tạo dễ dàng tìm thấy biểu định kiểu ảnh hưởng đến các phần tử của họ và gỡ lỗi kiểu, đặc biệt là khi các kiểu đó không được áp dụng một cách bất ngờ.

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

Phát kiến về AI

Bắt đầu với Thông tin chi tiết về bảng điều khiển, các cải tiến về AI hiện đã trở thành một phần không thể thiếu của Chrome DevTools, trong đó bảng điều khiển Trợ lý AI là trung tâm chính để gỡ lỗi bằng AI có nhận biết ngữ cảnh. Với Đề xuất mã trong bảng điều khiển Console và Sources, cùng tính năng chú thích tự động của Gemini trong Performance traces (Dấu vết hiệu suất), DevTools cung cấp một bộ công cụ toàn diện dựa trên AI để đơn giản hoá quy trình làm việc của bạn.

  • Khắc phục vấn đề về kiểu dáng toàn diện: Yêu cầu Gemini khắc phục các vấn đề về CSS và lưu trực tiếp những thay đổi đó vào tệp nguồn trên đĩa khi kết hợp với Workspaces.
  • Hỏi về hiệu suất: Giờ đây, bạn có thể thảo luận về dấu vết hiệu suất đầy đủ với sự trợ giúp của AI, hoặc tìm hiểu sâu về mọi Thông tin chi tiết về hiệu suất, hoặc sử dụng Gemini để chú thích dấu vết.
  • Gỡ lỗi trực quan: Bảng trợ lý AI đã trở thành bảng đa phương thức, cho phép bạn tải hình ảnh lên hoặc chụp ảnh màn hình để giúp Gemini hiểu và giúp bạn gỡ lỗi các lỗi trực quan.

Hiệu suất

Chúng tôi đã thiết kế lại bảng điều khiển Hiệu suất để việc gỡ lỗi hiệu suất trở nên dễ dàng hơn và mang tính hành động hơn. Ví dụ: giờ đây, dấu vết đã ghi lại đi kèm với thông tin chi tiết được tuyển chọn giúp bạn xác định các điểm tắc nghẽn nhanh hơn và điều hướng dấu vết nhanh hơn. Các điểm cải tiến khác bao gồm:

Nền tảng web

DevTools luôn bắt kịp nền tảng web đang phát triển, bổ sung các công cụ chuyên dụng cho quy cách CSS mới nhất, đồng thời cải thiện trải nghiệm của nhà phát triển đối với các tính năng đã có.

Chúng tôi đã thêm tính năng theo dõi chuyên sâu cho các chuỗi biến CSS phức tạp, Khả năng cung cấp đường cơ sở cho chú thích thuộc tính và gần đây đã giới thiệu tính năng hỗ trợ gỡ lỗi cho ảnh động phức tạp khi nhập bằng quy tắc @starting-style và một trình chỉnh sửa trực quan cho bố cục display: masonry mới.

Tải các 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 truy cập vào 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 các vấn đề trên trang web của mình trước khi người dùng tìm thấy!

Liên hệ với nhóm Chrome DevTools

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