Firescope는 디버깅 패널에 레퍼런스 탭과 컨텍스트 메뉴를 추가하는 새로운 Firebug 확장기능입니다.

기능

• HTML 엘리먼트, HTML 속성, CSS 속성을 검색할 수 있습니다(조합도 가능합니다). 입력과 동시에 검색하므로, 한 두 글자만 입력해도 원하는 결과를 얻을 수 있습니다. 
• 검색 결과에는 브라우저 호환성, 표준 준수, 간략한 사용 설명 등을 포함합니다. 더 많은 정보를 원하시는 분들을 위해 SitePoint 레퍼런스 웹 사이트로 연결하는 링크도 제공합니다.
• 검색 결과에서 마우스 오른쪽 버튼을 클릭하시면 두 가지 기능을 선택할 수 있습니다. 하나는 온라인에서 더 자세한 정보를 찾는 것이고, 다른 하나는 선택한 항목의 예제 코드를 보는 것입니다.
• 예제 코드는 레퍼런스, HTML, CSS 패널의 옆에 열립니다. 그리고, 해당 항목을 사용하는 방법에 대한 실전 예제를 간략한 설명과 함께 보실 수 있습니다. 예제 코드는 편집할 수 있으며, 복사하기도 편합니다(더블클릭하면 전체선택합니다).
• HTML 패널에서 엘리먼트 이름, 속성 이름 혹은 속성 값(편집도 가능)에서 오른쪽 버튼을 클릭하면 두가지 옵션 중 하나를 선택할 수 있습니다. 클릭한 항목을 "Look up"으로 살펴보거나 "Show Code Example"로 항목의 코드 예제를 볼 수 있습니다.
• 마찬가지로 CSS 패널에서도 속성 이름과 값 위에서 오른쪽 마우스 클릭을 할 수 있으며, 옵션도 같습니다.
• HTML 패널에서 현재 선택한 엘리먼트(보통 군청색 배경으로 강조)의 태그 이름 위에서 마우스 오른쪽 버튼을 클릭하면, 컨텍스트 메뉴에는 "Look up selection(선택영역 살펴보기)"사 나타납니다. 이 메뉴를 클릭하면 해당 엘리먼트에 정의된 모든 속성과 현재 적용된 모든 CSS 속성을 볼 수 있습니다. 이 기능은 "Reference" 탭을 클릭하면 자동으로 실행되어 현재 선택한 엘리먼트의 데이터를 보여줍니다.
• 검사기를 사용해 다른 엘리먼트를 선택할 때, HTML 패널 옆의 코드 예제(Code Example)을 열면 선택한 엘리먼트에 대한 예제를 자동으로 보여줍니다.
• 이와 유사하게, DOM 계층(crumbtrail)을 클릭할 때,  코드 예제(Code Exmaple) 패널이 열려있다면 열면 코드 예제를 보여줍니다. 메인 HTML 패널과 같은 컨텍스트 메뉴 항목이 있어 선택한 항목을 살펴보거나 관련한 코드 예제를 볼 수 있습니다.

from FireScope: Add a Web reference to your Firebug

YSlow가 새 버전에서 Firefox3를 지원합니다.

새 버전의 기능:

• Firefox 3와 Firebug 1.2 베타 지원
• 자바스크립트 최소화 개선 및 단순한 체크
• 인라인과 외부 CSS 혹은 JS의 색을 다르게 표시
• 컴포넌트 범례의 색상과 표시부 개선
• 동일한 호스트이름을 가지고 포트만 다른 사이트들을 분리된 DNS lookup으로 세던 버그 수정
• 자잘한 버그와 스타일 개선
  

from YSlow now has Firefox 3 support

6월 23일에 Velocity 퍼포먼스 컨퍼런스가 있었습니다. 거기서 Bill Scott씨가 Jiffy라는 새로운 Firebug 플러그인을 발표하셨습니다. 이 플러그인은 새 탭에 자세한 성능 측정 데이터를 보여줍니다.

Bill씨는 또한 이 툴을 사용하여 사용자 경험 성능을 측정하는 방법에 대해 상세한 포스팅을 하신 적이 있습니다.

from Jiffy Firebug Plugin: Fine grained calculation of performance timings

Firebug 1.2 beta 가 릴리스 되면서 FF3RC1 을 지원하게 되었습니다. 보다 잘 동작하게 되었다거나 성능이 좋아지거나 내부적으로 재설계된 것이 대부분인 것 같습니다.

중요한 점이 있다면 UI가 활성화되지 않으면 디버거도 동작하지 않아 부하를 줄이게 됐다는 것입니다. 비단 디버거 뿐만 아니라 HTML, CSS, DOM 등도 UI가 활성화 될 때만 같이 활성화되고, Script, Net 등의 패널은 "처음엔 사용하지 않음" 혹은 "항상 사용함"으로 설정할 수 있습니다.

위 기능 때문에 허용할 사이트(Allowed Sites)와 같은 기능은 사라지게 되었습니다.

from Firebug 1.2 beta for Firefox 3 RC 1 on Ajaxian

Kristopher William Zyp씨가 JavaScript 응용프로그램의 성능 분석에 YSlow를 사용하는 방법이라는 글을 작성하셨습니다.

웹 응용프로그램에서 개선해야할 부분이 무엇인지 알기 위해서는 응용프로그램의 컴포넌트를 제대로 분석해야만 합니다. 이 글에서 Firefox의 Firebug 확장기능과 웹 응용프로그램을 instrument하는 YSlow 애드-온을 사용하는 방법을 살펴보겠습니다. 이 도구들을 설치하고 난 후에, 개발중인 사이트에 접속하시고 Firefox 상태표시줄의 YSlow를 클릭하십시오. 그러면 Firebug의 YSlow 인터페이스가 열립니다. 이제 성능(Performance) 버튼을 클릭하시면, YSlow가 응용프로그램을 분석해 응용프로그램의 네트웍 전송 시간을 항목별로 정리해 그림1과 같이 보고합니다.

언급된 대부분의 개념은 웹 응용프로그램의 성능 개선을 위하 야후가 지정한 10가지 규칙으로부터 왔습니다. 하지만, Kristopher씨는 몇 개의 개념을 예제로 분류하고 데이터를 해석하는 방법을 설명했습니다. FireBug 프로 파일러의 설명은 특히 이제 막 Ajax 개발에 발을 들여 그들의 코드를 최적화하는 방법을 알고자 하는 이들이게 유용합니다:


from Ajaxian Featured Tutorial: Using YSlow for Performance Analysis on Ajaxian