Состоялся выход Firebug 2.0 для браузера Firefox

Знаменитый инструмент для разработчиков наконец-то получил большую порцию обновлений и сменил версию в названии. Помимо новых возможностей, наконец-то устранена одна досадная и большая проблема.

Выход первых версий отладчика Firebug в качестве расширения для Firefox состоялся очень давно. В некоторых браузерах тогда не было встроенных инструментов для разработчиков, а иных интернет-обозревателей не было как таковых. Это позволило ему получить заслуженную известность и долгое время, когда речь заходила про отладку веб-страниц в браузере, многие подразумевали именно данный инструмент как основной.

Однако, долгое время существовала одна проблема, которая не давала покоя многим пользователям. По многочисленным сообщениям в интернете, после установки первой версии расширения, сам Firefox начинал работать несколько медленнее. Советом было отключать Firebug, когда он не использовался. Дело, в том числе, было в используемом движке отладки JSD1 браузера. Начиная с Firefox 30, релиз, которого состоялся на днях, разработчики удалили поддержку JSD1, внедрив новый движок JSD2. Именно его поддерживает 2 версия сетевого инструмента. По замыслам, это должно решить и проблему производительности, возникавшую ранее. Список изменений обновления довольно большой, остановимся на некоторых моментах.

Подсветка синтаксиса

Одной из наиболее заметных функций является внедренная поддержка подсветки синтаксиса JavaScript. Помимо этого, подсветка синтаксиса добавлена и для HTML и CSS в режиме редактирования:

Улучшение читабельности кода

Функция Pretty Print позволяет организовать длинные и плохо понятные строки кода, например, JavaScript, в удобный для чтения код:

Инспектор DOM Events

Firebug 2 интегрирует расширение EventBug и вводит новую боковую панель Events в рамках существующей HTML-панели. Новая панель содержит список всех обработчиков событий на странице, где они сгруппированы по типу события для выбранного элемента DOM:

Поиск в HTML панели

Поиск в HTML-панели был улучшен. Теперь пользователи могут использовать CSS-селекторы или регулярные выражения, чтобы найти конкретные элементы:

Автозавершение кода

Была улучшена система автозавершения кода. Возможность доступна в Command Editor, где можно нажать на клавишу TAB и получить всплывающее окно с вариантами завершения:

Автозавершение работает также в breakpoint-всплывающем диалоге.Еще автозавершение доступно при редактировании атрибутов HTML (включая, например, SVG), а также стилей:

Инспектор выражений JavaScript

При отладке и переходе по коду, можно быстро проверить и исследовать детали любого выражения JavaScript. Достаточно просто навести курсор на выражение или выбранную часть кода и увидеть результат в подсказке:

Группировка логов консоли

В панели консоли добавлена новая опция, которая позволяет группировать сообщения консоли:

Инспектор возвращения значения из функции

Эта функция позволяет проверять и изменять значения, возвращаемые функцией JavaScript:

Включение и отключение отображения панелей

Еще одним из изменений Firebug 2 является возможность отключать показ отдельных панелей. Изображение ниже показывает способ того, как это можно сделать: