Google Chrome tương đương với Fireorms là gì?

29

Tôi đang tìm kiếm một công cụ có thể:

kiểm tra các yếu tố HTML
quản lý / gỡ lỗi JavaScript
hiệu suất hồ sơ
sửa đổi các yếu tố trong thời gian thực

— Evan Plaice
nguồn

32

Nó được tích hợp sẵn. Trang [paper] -> Nhà phát triển -> Công cụ dành cho nhà phát triển (trong Chrome v5 trở xuống). Nó có thể khác ở phiên bản 6 do nút Trang dường như biến mất trong phiên bản đó.

— Đánh dấu Hatton
nguồn

3

Có một số nhược điểm đối với công cụ của Google - xem các yêu cầu ajax không dễ dàng như vậy, không có chế độ đa dòng nào thuận tiện, bạn không thể chỉnh sửa HTML trong một cửa sổ, nó không hiển thị phần đệm / lề trên di chuột trong cây HTML, bạn chỉ đơn giản là không thể điều hướng DOM thực tế (chỉ là cây HTML) và cuối cùng nhưng không kém phần quan trọng, tôi thấy các tính năng chỉnh sửa CSS chỉ đơn giản hơn - không có tự động hoàn tất trong Google cho một điều. Nó vẫn còn rất nhiều có thể sử dụng được, nhưng Fireorms chỉ tốt hơn.

— cgp

2

Hoặc shift-ctrl-I cho người lười biếng :)

— Tim Post

1

@Mark Lưu ý, tôi đang sử dụng 5.0.375.99. Tôi không chắc chắn nếu nó làm cho một sự khác biệt bây giờ hoặc trong tương lai.

— Evan Plaice

1

Trong v6, đó là Cờ lê -> Công cụ -> Công cụ dành cho nhà phát triển

— enobrev

17

Nhấp chuột phải -> Kiểm tra phần tử

— HoLyVieR
nguồn

13

Firebird Lite cho Google Chrome .

— Emmett
nguồn

FireBug Lite là một công cụ tuyệt vời và cũng hoạt động trong IE, Opera, Safari và Firefox: getfireorms.com/fireormslite

— Nat Ryall

5

Đã 4 năm kể từ khi câu hỏi ban đầu được hỏi. Chrome (ổn định) hiện đã có phiên bản 38. Trong một thời gian dài, nó đã bao gồm một bộ Công cụ dành cho nhà phát triển đầy đủ tương đương với Fireorms cho Firefox (mặc dù Firefox cũng có trình kiểm tra tích hợp sẵn ).

Một số điều Công cụ dành cho nhà phát triển của Chrome cho phép bạn thực hiện:

Kiểm tra DOM
Kiểm tra CSS
Truy cập Bảng điều khiển JavaScript
Gỡ lỗi JavaScript
Xem các yêu cầu, thời gian và phản hồi của mạng
Xem kết xuất, JavaScript và hiệu suất CSS
Kiểm tra lưu trữ cục bộ và cookie

Các công cụ dev có thể được truy cập theo nhiều cách khác nhau.

Menu Chrome -> Công cụ -> Công cụ dành cho nhà phát triển
Ctrl+ Shift+ Itrong Windows hoặc Cmd+ Shift+ Itrên máy Mac
F12 trên Windows
Nhấp chuột phải vào bất cứ nơi nào trên một trang và chọn Kiểm tra phần tử

3

Các công cụ trong trình duyệt rất tốt trong công việc của họ và thường là lựa chọn đầu tiên tốt nhất của bạn, nhưng đôi khi chúng không cung cấp đủ chi tiết kỹ thuật về tải trọng yêu cầu / phản hồi HTTP hoặc quá cụ thể theo trang.

Trong những trường hợp này, bạn có thể thấy rằng một công cụ kiểm tra HTTP chuyên dụng như Fiddler hoặc một trong những lựa chọn thay thế của Linux sẽ cung cấp nhiều thông tin chi tiết hơn.

Nếu bạn thực sự cần lấy kim loại trần, Wireshark vượt xa HTTP để phân tích lưu lượng mạng đầy đủ, nhưng hãy chuẩn bị để bị choáng ngợp ngay từ đầu.

— JasonBirch
nguồn

Tôi không thể nói rằng tôi quen thuộc với fiddler nhưng Wireshark chắc chắn là kim loại trần quá mức. Wireshark thực sự chỉ hữu ích nếu bạn cần xem chi tiết các giao thức cấp thấp hơn.

— Evan Plaice

Fiddler gần gũi hơn với các công cụ phát triển firebird / chrome cho khả năng sử dụng. Một trong những nơi tôi thấy tiện dụng nhất là khi xuất bản các tệp KML trên trang web của tôi; bạn có thể thấy các yêu cầu và phản hồi từ các ứng dụng máy tính để bàn của Windows như Google Earth, không chỉ các trình duyệt web. Tôi đã sử dụng Wireshark một vài lần, nhưng đồng ý rằng nó thường không hữu ích cho công cụ quản trị trang web hàng ngày.

— JasonBirch

1

Bạn cũng có thể dùng thử Trình theo dõi tốc độ mã nguồn mở của Google - http://code.google.com.vn/webtoolkit/speedtracer/

Speed Tracer là một công cụ giúp bạn xác định và khắc phục các sự cố về hiệu suất trong các ứng dụng web của mình. Nó hiển thị các số liệu được lấy từ các điểm thiết bị cấp thấp bên trong trình duyệt và phân tích chúng khi ứng dụng của bạn chạy. Speed Tracer có sẵn dưới dạng tiện ích mở rộng của Chrome và hoạt động trên tất cả các nền tảng nơi tiện ích mở rộng hiện được hỗ trợ (Windows và Linux).

Sử dụng Speed Tracer bạn có thể có được bức tranh rõ hơn về thời gian sử dụng trong ứng dụng của mình. Điều này bao gồm các vấn đề gây ra bởi phân tích cú pháp và thực thi JavaScript, bố cục, tính toán lại và kết hợp bộ chọn kiểu CSS, xử lý sự kiện DOM, tải tài nguyên mạng, kích hoạt bộ đếm thời gian, gọi lại XMLHttpRequest, vẽ tranh, v.v.

— mvark
nguồn