Hardcore IT blog

Firebug

Firebug - плагін для Firefox. Досконалий інструмент для відладки і реверс-інженерії client-side web програм. В будь-який момент під час перегляду сторінки ви натискаєте Inspect і прямо в браузері курсором вибираєте елемент - Firebug підсвітить відповідне місце в деревовидному HTML візуалізаторі, покаже (!)ієрархію CSS, де можна прослідкувати які елементи успадковуються, а які перевизначаються. На скріншоті показаний приклад дослідження розмітки таблиць (Layout) :

Можна піти і зворотнім шляхом - знайти в HTML необхідний тег і навести на нього курсор - розумний плагін підсвітить його на сторінці, як це зображено на наступному скріншоті (зверніть увагу, що одночасно вам покажуть і відповідні CSS класи) :

HTML і CSS можна редагувати і прослідковувати зміни в реальному часі, причому із підказакми і автоматичним заповненням (як Intellisense). Ви зможете легко прослідкувати місцезнаходження конкретного CSS класу - файл і рядок. Конкретні поля CSS класу можна тимчасово вимикати.

Також дуже легко переглянути HTTP заголовки для окремих файлів, їхні розміри і час завантаження:

Звісно не обійшлось і без JavaScript дебагера і профайлера із всіма необхідними функціями.

Я міг би дуже довго описувати функціонал Firebug, розказувати про його зручність і інтуїтивність інтефейсу, але все ж краще спробувати його самостійно, щоб відчути всю його потужність. Однозначно Must Have.