Какие функции у Firebug отсутствуют в инструментах разработчика Chrome?
Я начинающий веб-разработчик, и у меня Firebug был рекомендован для отладки несколько раз. Пока что я только что использовал встроенные инструменты разработчика Chrome. Кажется, он делает все, что делает Firebug, и является более чистым и более организованным в качестве бонуса.
Как я получу более продвинутый способ отладки, есть ли функции Firebug, которые я буду пропускать с помощью Chrome DevTools? Если да, то каковы они?
Связанный: Firebug-подобный отладчик для Google Chrome
Ответы
Ответ 1
Я использовал Firebug с самого начала, и это было находка, как изобретение огня. Но затем Chrome вышел с отладчиком, и я попробовал. Я продолжал использовать Firebug, но следил за инструментами Chome dev и, наконец, больше не мог придумать, почему бы не переключиться после добавления инструментов JSON в v12.
Chrome DevTools пинает, потому что имеет:
- Встроенный анализатор времени, анализатора профилей и кучи
- Встроенный инструмент аудита
- Можно получить доступ и редактировать Local/SessionStorage, Cookies, SqlLite DB, WebSQL, AppCache и т.д.
- Обнаружение сети WebSockets
- Отладчик JS имеет еще несколько функций (например, точки останова WebWorker)
- Отладчик JS позволяет вам редактировать JS на лету и запускать его (JSFiddle без скрипта)
- Каждое окно получает окно devtools, если вам нравится; Firebug - одноэлементный
- Firebug перенаправляет страницу, замедляя ее загрузку и введя CSS для своей функции инспектора.
ОБНОВЛЕНИЕ: 2 года спустя я должен поздравить команду Firefox с огромными успехами. Тем не менее, команда Chrome и отладчик совершают огромные скачки на ежемесячной основе, возглавляя отрасль. Я бы обновил вышеуказанный список, но, честно говоря, он заполнил бы всю страницу.
Ответ 2
У меня нет функции Firebug, которую я пропустил еще после перехода на Chrome.
Ответ 3
Инструменты разработчика Chrome взяли на себя функции Firebug, поэтому есть все основные функции и знакомые (например, объект $0
и console
).
Есть несколько небольших различий, таких как DevTools не имеют панели CSS (хотя CSS-таблицы можно манипулировать на панели "Элементы" ).
У инструментов Chrome также есть панели Timeline, Profiles и Storage. Панель Timeline регистрирует загрузку, рендеринг CSS и парсинг JavaScript. Панель "Профиль" профилирует использование ресурсов и панель "Хранилище" показывает и позволяет изменять базу данных сайта, локальное хранилище, хранилище сеансов и файлы cookie.
Наконец, оба инструмента имеют свои незначительные отклонения, которые делают разные действия немного проще или сложнее. Мой совет - использовать Firebug для Firefox и DevTools для браузеров Webkit, поскольку в Chrome работает только Firebug Lite, и в нем не хватает многих функций, которые имеет обычный Firebug (а DevTools встроены в Chrome).
Ответ 4
Я чувствую себя намного более комфортно, используя Firebug. На данный момент я не могу придумать специфику, но иногда я пытаюсь отлаживать что-то в Safari или Chrome, и похоже, что это PITA, я запускаю Firefox и быстро делаю все, что можно сделать.
Вкладка DOM - это плюс для одного. Он более доступен и хорошо выложен, чем эквивалент Chrome. Я предпочитаю, чтобы DOM и другие объекты JS регистрировались на консоли в Firebug.
Плагины Firebug, такие как Pixel Perfect, также очень полезны. Я не знаю, существует ли такой инструмент для Chrome.
В целом, это не имеет значения, потому что вы должны протестировать в обоих браузерах. И IE, так что можно сравнить его с инструментами IE Dev (которые улучшились, но все же не хороши по сравнению с FF или Webkit's).
Я не думаю, что в Firebug есть что-то продвинутое, но не в Chrome, которое вам не хватает.
Ответ 5
EDIT. Это было правдой, но Chrome Dev Tools реализовали ее.
Firebug может выполнять поиск во всех сценариях, загруженных на страницу. Chrome Dev Tools может выполнять поиск только в выбранных script, AFAIK.
Ответ 6
У Firebug для выбора мыши отличный вариант, но я не могу найти его в инструментах разработчика Chrome.
Это беспокоит меня, потому что я не могу найти в нем горячий ключ в firebug, в то время как хром его полностью не хватает.
Я разработчик noob, поэтому мышь по-прежнему используется большую часть времени при разработке.
Ответ 7
Насколько я могу судить, Firebug - единственный, который может редактировать HTML-код и текст в реальном времени при вводе. Очень полезно, если вы, например, пытаетесь увидеть, как текст поместится в контейнер и добавит по одному символу за раз.
В Chrome при редактировании HTML вы должны нажать TAB или ENTER, чтобы выйти из режима редактирования и просмотреть изменения на своей странице.
В Firebug вы также можете сразу ввести HTML-код. В Chrome вы должны щелкнуть правой кнопкой мыши и выбрать "Редактировать HTML". В противном случае он будет отображаться как <b> полужирный </b> .
Я действительно хочу перейти на Chrome, так как он работает быстрее, но для меня слишком важна живая редакция.
Ответ 8
В то время, когда этот вопрос был задан, Firebug был зверь, но теперь Chrome Developer Tools (DevTools) удобны для веб-разработчиков. Хотя я не пишу о Firebug, потому что я изучил веб-разработку с помощью Firefox с Firebug.
Это был отличный инструмент для веб-разработки, и он представил все основные функции DevTools и Firefox DevTools. Однако я переключился на Chrome DevTools, хотя они не охватывают все функции Firebug, потому что они легкие и намного быстрее Firebug, доступ к localStorage легко определяется, и источники, по моему мнению, организованы там.
Здесь я расскажу, как уникальные функции в Firebug,
-
Поиск
Опция поиска хорошо определена в Firebug, потому что ее легко доступны, и мы можем искать ключевое слово с чувствительным к регистру и регулярным выражением.
-
DOM:
Структура DOM может быть легко доступна в Firebug с различными параметрами фильтрации , такими как Show User-defined Properties, Show User-defined Functions и т.д.
-
Cookies
Firebug позволяет нам создавать собственные файлы cookie и предоставляет экспорт файлов cookie.
-
Сеть/нетто:
Firebug имеет панель Net, где DevTools называют ее Network. Оба они полезны для анализа всех запросов, сделанных для загрузки ресурсов и их статуса. В Firebug мы можем легко понять ресурсы Удаленный IP.
-
Источники:
Даже несмотря на то, что в DevTools доступен Source Edit, я считаю, что Firebug лучше использовать Source Edit, потому что если вы хотите отредактировать CSS файл в DevTools, вам нужно перейти в Источники затем нажмите Ctrl + O, чтобы найти файл. Только тогда вы можете отредактировать файл. В Firebug вы можете легко найти Source Edit под каждой вкладкой меню.
-
Поддержка dojo:
Как только я был разработчиком dojo, Firebug был легко расширен для поддержки dojo разработки, используя Dojo Firebug Расширение.
Ответ 9
Объективно увиденный Firebug 2.0 имеет множество мелких функций, которых у Chrome DevTools нет. Некоторые из них перечислены здесь:
Панель консоли
панель HTML
панель CSS
панель DOM
- Отображает все свойства DOM в одном месте.
- Отображает закрывает
- Позволяет фильтровать отображение по свойствам, функциям и т.д.
панель Net
- Позволяет останавливаться на XmlHTTPRequests
- Показывает информацию о кеше для запроса
Панель файлов cookie
- Создание и редактирование файлов cookie
- Контроль разрешений cookie
- Показывает исходный и отформатированный размер файлов cookie.
- Позволяет остановить выполнение script при изменении файла cookie
- Экспорт файлов cookie в стандартном формате
Общие
- Откройте HTML, CSS и JavaScript во внешнем редакторе
- Позволяет настраивать ярлыки
Функция ", которая выходит за рамки удобства использования, заключается в том, что Firebug является с открытым исходным кодом. Поэтому каждый может участвовать в этом.
Сказав это, Chrome DevTools (а также Firefox DevTools) имеют гораздо больше возможностей и других меньших и больших преимуществ перед Firebug, поскольку команда, стоящая за Firebug, очень мала по сравнению с командами, стоящими за другими DevTools.
Кроме того, Firebug 3+ интегрируется во встроенный Firefox DevTools, а это означает, что эти версии наследуют все функции Firefox DevTools и могут добавьте дополнительные функции.
Ответ 10
Firebug имеет возможность подключить к нему другой плагин, например Firecookie. Для остальных они довольно похожи, все по вкусу, на мой взгляд.
Ответ 11
также добавить, что он может xopy XPATH добавить CSS-селектор для HTML-элемента.
ЭТО действительно удобно иногда!:))) hahaha
Ответ 12
Я думаю, что инструменты для разработки похожи, но у меня были проблемы с тем, что Chrome не кэшировал ничего. Даже установка настройки Chrome "Отключить кеш" не работала в 100% случаев; Я не уверен, почему.
У меня не было этой проблемы с Firefox/Firebug, поэтому я все еще использую ее.
Ответ 13
Добавление моих небольших центов...
-
Chrome Inspector не мог сортировать свойства CSS в алфавитном порядке, когда Firebug мог сделать это как шарм. Это помогает, когда вы проверяете какой-то элемент css и вам нужно его захватить.
В соответствии с хорошей практикой кодирования CSS всегда лучше иметь свойства CSS, отсортированные по алфавиту в вашем коде.
-
Когда вы работаете над проектом, связанным с множеством скриптов. В firebug под тегом script у вас есть возможность поиска файла js в предложенном окне.
Где, как и с хром, у вас будет представление с хромым деревом, чтобы найти ваш JS файл, который является утомительным для просмотра пространства имен вашего js файла и пересечения дерева.
Этот параметр может не повлиять на всех, кто связан с небольшими JS файлами в своем проекте. Эта функция является ударом с firebug, который я использую, когда мои скрипты содержат более 1000 JS файлов.
Ответ 14
Почти сегодня был установлен коммутатор, но я заметил, что не могу щелкнуть правой кнопкой мыши по модифицированному CSS в Chrome и скопировать объявления Rule или Style, как я могу в firebug. БОГ Я хочу, чтобы firefox не начинал сосать, иначе у меня не было бы этой проблемы.
Ответ 15
С хром-отладчиком я могу отлаживать jsni моего проекта GWT, где FireBug просто показывает анонимную функцию, и я действительно не признаю действительную функцию вообще.
Ответ 16
Мне нравится инструмент Chrome dev, но когда-то я пропустил эту мощную функцию от firebug.
- Условная точка останова: пауза только при определенных условиях.
- Вызов функций ведения журнала: отметьте функцию и посмотрите все, что вы хотите знать в консоли.
- Отменить изменение свойства. Отметить объекты и отладчик приостановит, если свойство будет изменено.