Главная > AJAX, Mozilla Firefox, Open Source, web2.0, веб-обзоры, Разное > Firebug 1.3 и 1.4 alpha — что нового и интересного?

Firebug 1.3 и 1.4 alpha — что нового и интересного?

7 ноября 2008

Приветствуем наших читателей. Нда, долго я не писал, хотя на это и есть объективные причины, все равно приношу извинения тем читателям и подписчикам, кто ждал новых материалов. За это время я успел вроде как закончить аспирантуру - где, кстати, наш блог выступал как часть моего научного исследования под крутым определением "частное тематическое профессиональное интернет-СМИ". Ну и отболел, как и многие здесь вокруг - то ли грипп, то ли какая инфекция, не знаю. Впрочем, это детали, сегодня наш разговор о другом и гораздо более интересном.

Если вы профессиональный веб-разработчик и постоянно имеете дело с разработкой и отладкой сложных 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 веб-приложений.

Developers.org.ua