Firefox Developer Tools thay thế Firebug

Thứ tư - 11/10/2017 09:00

Vừa qua, Mozilla đã chính thức thông báo ngưng phát triển FireBug và khuyên các nhà phát triển web chuyển sang sử dụng Firefox Developer Tools. Và để ép quá trình chuyển đổi nhanh chóng, Mozilla đã làm cho Firebug không còn tương thích với FireFox 56.0 (phát hành ngày 28/09/2017)

Mozilla thông báo Firebug ngưng phát triển và khuyên chuyển sang Firefox Developer Tools

Firefox Developer Tools gồm rất nhiều công cụ mà phần mềm chính của nó là Firefox Developer Edition. Firefox Developer Edition thực chất là phiên bản trình duyệt web dành cho những nhà phát triển web. Phiên bản chính thức đầu tiên của Firefox Developer Edition được Mozilla chính thức phát hành cuối năm 2014 nhân dịp kỷ niệm sinh nhật lần thứ 10 của mình. Mục tiêu chính khi phát triển trình duyệt này của Mozilla là nhằm giải quyết những vấn đề thường gặp của các nhà phát triển khi tạo nội dung trên nhiều môi trường hay các kho ứng dụng khác nhau, giúp giảm bớt tình trạng phải sử dụng quá nhiều nền tảng cũng như trình duyệt khi làm việc, giúp tăng hiệu suất công việc của các nhà phát triển. Firefox Developer Edition không phải là một trình duyệt mới mà đó là một công cụ phát triển, giúp đơn giản hoá toàn bộ quá trình tạo một trang web dù cho nhà phát triển có đang làm việc trên các thiết bị khác nhau.

Giống như Firefox Nightly, Firefox Developer Edition được phát hành với 2 phiên bản 32/64-bit dành cho Windows, Mac OSX và Linux. Bạn có thể tải về tại đây: https://www.mozilla.org/en-US/firefox/developer/

Các tính năng chính của Firefox Developer Edition

Page Inspector

The all-new Inspector panel in Firefox 57.

Sử dụng Page Inspector để kiểm tra và sửa đổi HTML và CSS của một trang web.

Web Console

Xem các thông điệp đăng nhập bằng một trang web và tương tác với các trang sử dụng JavaScript.

JavaScript Debugger

Dừng lại, cho qua, kiểm tra và sửa đổi mã JavaScript đang chạy trong một trang.

Network Monitor

Xem các yêu cầu mạng được thực hiện khi trang được tải.

Performance Tools

Phân tích đáp ứng của trang web của bạn nói chung, JavaScript, và hiệu suất layout.

Responsive Design Mode

Xem cách trang web hoặc ứng dụng của bạn sẽ xem và ứng xử trên các thiết bị và loại mạng khác nhau.

Các công cụ khác của Firefox Developer Edition

Những công cụ dành cho nhà phát triển này cũng được tích hợp trong Firefox. Không giống như "Công cụ cốt lõi" ở trên, bạn có thể không sử dụng chúng mỗi ngày.

Memory: Tìm hiểu xem các đối tượng nào đang chiếm dụng bộ nhớ được sử dụng. Storage Inspector: Kiểm tra cookie, lưu trữ cục bộ, indexedDB và bộ nhớ phiên hiện tại trong một trang web. DOM Property Viewer: Kiểm tra thuộc tính DOM của trang, functions, v.v. Developer Toolbar: Một giao diện dòng lệnh cho các công cụ phát triển. Eyedropper: Chọn màu từ trang. Scratchpad: Một trình soạn thảo văn bản được xây dựng trong Firefox cho phép bạn viết và thực thi JavaScript. Style Editor: Xem và chỉnh sửa các kiểu CSS cho trang hiện tại. Shader Editor: Xem và chỉnh sửa các vertex và fragment shaders sử dụng bởi WebGL. Web Audio Editor: Kiểm tra biểu đồ của các nút âm thanh trong một ngữ cảnh âm thanh và sửa đổi các tham số của chúng. Taking screenshots: Chụp ảnh màn hình của toàn bộ trang hoặc của một phần tử.

Trình duyệt Firefox Developer Edition có sẵn rất nhiều công cụ để tạo lập, debug, giám sát hiệu suất, sửa lỗi website. Ngoài các công cụ có sẵn, bạn còn có thể tìm hiểu về Firefox Developer Tools và tìm hiểu thêm về các công cụ hỗ trợ khác tại đây: https://developer.mozilla.org/en-US/docs/Tools

Từ khóa: Firefox Developer Tools, Firebug, Firefox Developer Edition