Jakie unikalne funkcje ma Firebug, a które nie są wbudowane w przeglądarkę Firefox?

99

Właśnie wyczyściłem dodatki do Firefoksa i zastanawiałem się:

  • Jakie funkcje ma Firebug, które czynią go wyjątkowym?

  • Jakie funkcje są dostępne zarówno w Firebug, jak i Firefox Developer Tools?

janpio
źródło
3
Czytam mój kanał rss pod kątem Mozilla Hacks i wygląda na to, że w tej chwili natywne narzędzia stają się lepsze niż Firebug. Byłoby miło, gdyby ktoś, kto z nimi współpracował, mógł to potwierdzić za rok 2014. np. - hacks.mozilla.org/2014/02/…
llamerr 22.04.14
2
Biorąc pod uwagę obecny, stosunkowo szybki cykl wydawniczy Firefoksa, czy nie byłoby opłacalne po prostu połączyć wysiłki? Zawsze byłem zdziwiony, dlaczego Firebug nie poszedł tą samą drogą, co powiedzmy pdf.js, kiedy Firefox DevTools były prymitywne ... Z nowszymi DevTools od Firefox 29, widzę siebie przeskakującego między Firebug i DevTools dla niektórych zadań które można lepiej wykonać w jednym lub drugim.
unode

Odpowiedzi:

53

Natywne narzędzia programistyczne Firefoksa przeszły długą drogę od czasu napisania tego pytania. Różnice sprowadzają się głównie do następujących punktów:

  • Nie można zatrzymać wykonywania skryptu w przypadku mutacji DOM, XHR lub zmian plików cookie.
  • Nie można skopiować XPaths.
  • Brak panelu bocznego zdarzeń w Inspektorze (chociaż zdarzenia są wyświetlane w strukturze DOM).
  • Brak panelu bocznego DOM w Inspektorze.
  • Brak podglądu na żywo podczas edycji HTML.
  • Brak autouzupełniania dla niewliczalnych właściwości w wierszu poleceń.
  • Nie można wyszukiwać w wielu plikach w Edytorze stylów.
  • Brak wielowierszowego wiersza poleceń w konsoli internetowej (chociaż mają Brudnopis i „inteligentną wielowierszową” linię poleceń)
  • Brak przycisków paska narzędzi do przełączania narzędzi lub Inspektora.
  • Nie można wyszukiwać w odpowiedziach na żądania sieciowe.
  • Brak autouzupełniania dla kilku właściwości CSS.
  • Brak kilku poleceń wiersza poleceń.
  • Nie można dodać plików cookie, po prostu edytuj istniejące.
  • Brak trybu zawsze włączonego i aktywacji na domenę (zamiast na kartę).

Brakuje więcej rzeczy, które są śledzone w zgłoszeniu błędu dotyczącym wszystkich luk między Firebug i Firefox DevTools .

Integracja z Firebug

Firebug jest teraz oparty na natywnych narzędziach programistycznych. Od Firefoksa 48 istnieje również motyw Firebug, który wygląda jak rozszerzenie Firebug, dzięki czemu poczujesz się jak w domu, jeśli jesteś przyzwyczajony do Firebug. Po włączeniu wieloprocesowego Firefoksa naciśnięcie F12lub kliknięcie przycisku Firebug otwiera narzędzia Firefox DevTools i motyw Firebug.

Istnieje również przewodnik migracji wyjaśniający różnice między Firebug i Firefox DevTools.

Sebastian Zartner
źródło
2
15.11.2014 - FF 33.0: Wprowadzono wiele ulepszeń do natywnego narzędzia inspekcji: Filtry są dostępne na karcie sieci ; Wiele naprawdę fajnych i przydatnych funkcji : widok 3D, tryb projektowania responsywnego, narzędzie do pobierania kolorów, używana czcionka + podgląd czcionki; Ogromna przewaga wydajności w porównaniu do Firebug ; Pliki cookie można przeglądać za pomocą przeglądarki Firefox -> Narzędzia -> Informacje o stronie -> Bezpieczeństwo . Mam nadzieję, że pewnego dnia uda mi się zastąpić firebuga narzędziami natywnymi, ponieważ uważam, że dodatek do firebug nie może uzyskać wysokiej wydajności narzędzi natywnych.
malisokan
Jak wypada FireBug 3.0 w porównaniu z narzędziami natywnymi? Wygląda na to, że po prostu ściągnęli skórki z natywnych narzędzi i nie mogę znaleźć żadnego porównania między Firebug 3.0a9 a natywnymi narzędziami programistycznymi w FF 36.0.1?
gabaum10
31

Istnieje wiele małych funkcji Firebug, których nie mają wbudowane narzędzia. Oto, co przychodzi mi na myśl, bawiąc się interfejsem użytkownika, ale jestem pewien, że jest ich więcej:

  • możliwości kontroli zamknięcia, takie jak someFunction.%closureVarskładnia wiersza poleceń
  • kliknij prawym przyciskiem myszy, aby odtworzyć dowolną wartość w wierszu poleceń
  • jedno kliknięcie, aby edytować
  • podświetlanie elementów po najechaniu kursorem
  • interfejsy API wiersza poleceń, takie jak includeigetEventListeners
  • umiejętność pokazywania stylów UA
  • „Dodaj regułę” z panelu Styl
  • panel CSS, którego można używać w zminimalizowanym CSS
  • gdy element zawiera tylko tekst, panel HTML wyświetla tekst w tekście
  • Logowanie XHR w konsoli z prettification JSON (i które nie otwiera wyskakującego okienka)
  • „Przerwa przy zmianie atrybutu / zmianie poddrzewa / usunięciu węzła” w panelu HTML
  • „Przerwa przy mutacji”, „Przerwa przy zmianie”, „Przerwa przy zmianie właściwości”, „Przerwa przy zmianie pliku cookie”
  • cały panel Cookies
  • stos śladów w panelu Console
  • edycja i wklejanie HTML
  • wyszukiwanie dowolnego tekstu w większości paneli
  • w razie potrzeby wiele opcji do obejrzenia
  • rejestrowanie zdarzeń

Istnieją oczywiście również aspekty subiektywne. Na przykład osobiście bardziej podoba mi się interfejs użytkownika i wygląd Firebuga niż czerń narzędzi dev, a wcześniejsza znajomość narzędzia jest zawsze ważna.

Simon Lindholm
źródło
1
Wydaje się, że wiele z tej listy nie ma dziś znaczenia.
Aleks-Daniel Jakimenko-A.
firebug został niedawno zintegrowany z firefoxem (11.2016) ... i wszystkie te proste funkcje / małe, ładne ulepszenia, takie jak "jedno kliknięcie, aby edytować", zniknęły ... wszystkie dobre rzeczy zniknęły ... tak samo jak produktywność użytkowników firebuga :( ... ogólnie interfejs użytkownika firebuga był lepszy i szybszy w
obsłudze
6

Wkrótce będzie to nieistotne, ponieważ Firebug i natywne narzędzia programistyczne będą się łączyć:

Firebug 2 nie działa w przeglądarkach wieloprocesowych (np. E10s), a konwersja jest zbyt złożona, przestanie działać, gdy e10s zostanie aktywowany w Firefoksie.

Chcemy być gotowi, gdy Firebug 2 przestanie działać i opracowaliśmy następujący plan.

Zintegruj wszystkie funkcje Firebug 3 z wbudowanymi narzędziami Firefoksa i przekaż do niego wszystkich użytkowników Firebuga.

Zastąp Firebug 2, wypuszczając Firebug 3 (na AMO) tylko wtedy, gdy musimy dostarczyć krytyczne funkcje, których brakuje w narzędziach programistycznych Firefox w rozszerzeniu.

Aktualnie pracujemy nad przeniesieniem XHR Inspector ( błąd 1211525 ), panelu DOM ( błąd 1201475 ) i motywu Firebug ( błąd 1244054 ).

Głównym celem następnej wersji Firebug będzie integracja z wbudowanymi narzędziami programistycznymi Firefoksa. Oprócz tego grupa robocza Firebug planuje kilka nowych funkcji rozszerzających DevTools o nową funkcjonalność.

Firebug 3.0 alpha (aka Firebug.next) jest obecnie kompatybilny z Firefox 35-36 i będzie obsługiwał nadchodzące przeglądarki wieloprocesowe (jak również nie wieloprocesowe).

Firebug 3.0 (znany również jako Firebug.next) reprezentuje następną generację Firebug zbudowaną na bazie natywnych narzędzi programistycznych Firefox.

Jeśli zainstalujesz Firebug 2 w przeglądarce obsługującej wiele procesów (e10s), zostaniesz poproszony o aktualizację do Firebug 3 lub wyłączenie obsługi wieloprocesowej.

Mozilla już kilkakrotnie opóźniała wydanie Electrolysis. Obecny plan to wydanie wieloprocesowego Firefoksa na stabilnym kanale 19 kwietnia 2016 r., Kiedy to Firefox 46 zostanie wydany na stabilnym kanale.

Jest to jednak tylko przewidywana data premiery i możliwe jest dalsze opóźnienie elektrolizy.

Ciekawym pomysłem, który Mozilla musi uczynić wydanie mniej bolesnym dla użytkowników przeglądarki, jest włączenie Elektrolizy tylko w wersjach Firefoksa bez dodatków oraz w wersjach Firefoksa, w których zainstalowane są tylko kompatybilne dodatki.

Od jakiegoś czasu pracujemy nad ujednoliceniem narzędzi programistycznych Firefox i Firebug. Od Firefoksa 49 będziemy dostarczać wbudowany Firebug.next.

Jeśli korzystasz z wbudowanych narzędzi programistycznych Firefox zamiast Firebug, możesz polubić panel DOM i motyw Firebug, które dodaliśmy podczas tego scalania.

Ponadto przeportowaliśmy kilka popularnych rozszerzeń Firebug (PixelPerfect, FireQuery i HARExportTrigger poprzednio NetExport). A skoro już o tym mowa, może spodobać Ci się nasze nowe rozszerzenie WebSocket Monitor.

W ramach przenoszenia funkcji Firebuga do wbudowanych narzędzi, przenosimy również motyw Firebug, dzięki czemu użytkownicy Firebug mają bardziej znane środowisko do pracy.

Ten motyw jest gorący, gorący, gorący! Przywitaj się z motywem Firebug dla narzędzi programistycznych

Mozilla wypuściła dziś przeglądarkę Firefox 48 dla systemów Windows, Mac, Linux i Android. Przeglądarka zyskała obsługę wielu procesorów (w końcu), lepszą ochronę przed szkodliwymi pobieraniami i ulepszenia multimediów na Androida. Wsparcie dla starszych wersji OS X i Android Gingerbread zostało usunięte.

W Firefoksie 48 Mozilla powoli włącza obsługę wielu procesów, zaczynając od 1 procenta użytkowników i zwiększając prawie połowę kanału wydań Firefoksa. Aby sprawdzić, czy jesteś w grupie elektrolizy, wpisz „about: support” w pasku adresu URL i sprawdź, czy w elemencie zamówienia Multiprocess Windows jest napis „1/1 (domyślnie włączone)”.

Bibliografia

Paul Sweatte
źródło
To nadal będą istotne, nie są one scalanie , nowy Firebug zostanie zbudowany na szczycie DevTools więc nie powielać istniejących możliwości, ale to wciąż mają pewne niepowtarzalne.
użytkownik
@user Honza, jeden z głównych programistów, powiedział to na blogu Mozilla hacks, do którego link znajduje się powyżej:One of our goals is to bring Firebug UX into native devtools, so yes, features are mixing to devtools.
Paul Sweatte,
1
„Firebug 3 nie jest kolejnym narzędziem programistycznym, to raczej cienka warstwa zbudowana na bazie DevTools, zapewniająca nowy motyw, który sprawia, że ​​DevTools wygląda jak Firebug. Jest też kilka dodatkowych funkcji, które będziemy przenosić do DevTools krok po kroku . ” ( źródło ) Więc uważam, że masz rację, w końcu zostanie całkowicie scalony z DevTools.
użytkownik
5

Myślę, że nadal największą zaletą - po wdrożeniu funkcji Network Panel i Timeline - jest dostępność różnych rozszerzeń Firebug , takich jak na przykład YSlow, Page Speed, FirePython i tak dalej.

Ostatecznie jest to prawdopodobnie bardziej wybór oparty na twoich osobistych preferencjach, aby wymyślić broń, która zapewni ci największą wygodę i szybkość.

Ciekawym szczegółem tej decyzji jest to, że Firebug był kiedyś jedną z wtyczek, które miały największy negatywny wpływ na wydajność Firefoksa. Nie wiem o obecnym badaniu na ten temat, zwłaszcza jeśli wbudowane narzędzia programistyczne działają lepiej pod względem wydajności niż Firebug.

Volker E.
źródło
4
Ta lista dotyczy tylko wydajności uruchamiania, która znacznie się poprawiła w wersji 1.10, kiedy Firebug został wykonany z opóźnieniem ładowania. Mimo to, narzędzia Devtools Firefoksa bardziej dbają o wydajność podczas użytkowania, po części właśnie dlatego, że chcą uniknąć uszkodzenia przez ogólny pogląd, że Firebug jest „powolny”. Nie wiem, czy daje to więcej użyteczności.
Simon Lindholm,
0

Jedną z zalet natywnych narzędzi deweloperskich w porównaniu z obecną wersją firebuga jest to, że ma sourcemaps, podczas gdy firebug nie.

Lajos Meszaros
źródło
0

Unikalne funkcje, które ma Firebug, ale wbudowany inspektor Firefoksa nie ma, obejmują:

  • Skopiuj XPath
  • Skopiuj minimalną ścieżkę XPath
  • Skopiuj ścieżkę CSS

Unikalne funkcje, które ma wbudowany inspektor Firefoksa, ale Firebug nie ma, obejmują:

  • Skopiuj unikalny selektor
sampablokuper
źródło
FYI, kopiowanie XPath elementu jest wymagane w błędzie 987877 , kopiowanie ścieżki CSS jest możliwe od Firefox 53.0 poprzez kliknięcie prawym przyciskiem myszy na elemencie> Kopiuj > Ścieżka CSS (patrz błąd 1323700 ).
Sebastian Zartner
0

Wiersz poleceń konsoli w trybie dużego edytora umożliwia uruchamianie kodu w bieżącym kontekście. Nowy Brudnopis nie widzi bieżącego zakresu punktu przerwania. To straszna strata.

tqwhite
źródło