Если вы профессиональный веб-разработчик и постоянно имеете дело с разработкой и отладкой сложных AJAX приложений, то наверняка знаете и используете Firebug — плагин для браузера Firefox, предназначенный для отладки и исследования веб-приложений. Текущая его версия, 1.2х достаточно стабильная и функциональна, чтобы помочь в 99% проблем, которые могут возникнуть при разработке. Но и этот инструмент не лишён если не недостатков, то некоторых фич, которые могли бы облегчить работу. И даже идеальный инструмент можно сделать ещё более идеальным, как бы это не звучало.Не так давно, если зайти на основную официальную страницу Firebug, я обнаружил там два небольших сюрприза. Первый — это бета-версия следующего поколения, версии 1.3. А второй сюрприз — разработчики думают не только о ближайшем будущем, но и ещё дальше — доступна сразу и альфа версии 1.4. А вот что там нового и интересного, мы сейчас рассмотрим.
Firebug 1.3
Одним из существенных изменений и дополнений этой версии является модуль Tracing. Он позволяет отслеживать все изменения в поведении как браузера, так и других плагинов, состояние кеша, отслеживать операции с CSS и DOM и многое другое. По сути это логгер (и достаточно подробный) всех событий, что происходят в браузере. Модуль очень пригодится для отладки как веб-приложений, так и компонент браузера или расширений, так как работает на более высоком уровне (или глубоком), чем просто сам Firebug. Что бы не утонуть в море сообщений, предусмотрена гибкая настройка, что именно перехватывать и отображать в логе.
Модуль отладки JavaScript также подвергся модификациям, в частности модифицирована структура отображения исходного кода для того, чтобы более эффективно работать с большими файлами. Это хорошо, так как раньше работать с библиотеками вроде ExtJS (особенно дебаг-версией) было иногда сложно из-за торможения на таком большом коде. Остальные изменения направлены на улучшения работы дебаггера в случае работы с замыканиями (подробнее отлично описано в этой статье), что не менее важно при работе с сложными конструкциями на JavaScript.
Вкладка, где отображаются все DOM-объекты страницы, теперь выводит список в алфавитном порядке (гм, а я даже не замечал, как оно раньше выводило-то).
Вкладка Net, которая помогает следить за сетевой активностью приложения, теперь также существенно расширена и переделана, при этом даже не надо быть супер профессионалом, чтобы начать использовать её нововведения — она просто преобразилась на глазах и теперь это реальный инструмент для оптимизации веб-приложений. Теперь для каждого компонента у нас собирается и выводится подробнейшая статистика обработки — сколько времени занимает создание подключения к серверу, отсылка запроса, ожидание ответа сервера, передача самих данных. Кроме этого, мы можем отслеживать два главных события в «жизни» страницы — событие DOMContentLoaded сигнализирует, что все данные для формирования DOM загружены (я не уверен, но похоже это событие есть только в Firefox/Gecko), а потом уже генерируется событие onload (объект window), которое сообщает приложению, что все готово к работе. С новой панелью мы можем видеть затрачиваемое время на каждую стадию, а также временные метки каждого компонента (относительно описанных выше событий). С такой информацией мы можем производить тонкие операции по настройке и оптимизации как сервера так и клиента с целью уменьшить время отображения страницы.
Среди остальных изменений: усовершенствования для разработчиков расширений для Firebug-а, улучшена локализация (правда, среди них пока нет русского языка) и закрыто около 40 обнаруженных ошибок.
Отмечу, что сейчас предлагается для установки две версии — с модулем Tracing Console и без него, так что если вы не занимаетесь разработкой плагинов или не исследуете внутренности браузера, можно ставить обычную версию. Пока ещё консоль не до конца оттестирована и может вызвать зависания браузера, особенно если вы в опциях включили отслеживание множества событий.
Firebug 1.4
Эта версия является дальнейшим развитием версии 1.3 и, несмотря на то, что пока только альфа-версия, её уже можно использовать в реальной работе (что я и сделал). Пока разработчики заявляют, что в этой версии они делают акцент на разработчиков расширений (как для браузера, так и для самого Firebug), заявлено, что будет улучшенный CSS Explorer, улучшенный редактор для различных типов данных, чтобы корректно отображать разные передаваемые по сети данные (расширение панели Net). Хорошая новость для дизайнеров — планируется, что вносимые изменения в CSS стили можно будет сразу же сохранить назад на сервер в исходный файл.
Полный список запланированного в 1.4 выложен в SVN-версии исходных кодов здесь, и там очень много интересного, конечно же, не все будет реализовано в этой версии, что-то станет не актуальным, однако даже если часть из описанного будет реализована, Firebug снова подтвердит звание самого мощного инструмента для отладки и исследования AJAX веб-приложений.
