구글 크롬에는 V8 디버거라는 자바스크립트 디버거도 있습니다만, 이번에 새롭게 크롬 개발툴 프로토콜(Chrome Dev Tools Protocol)이라는 것을 선보였습니다.
V8 디버거는 자바스크립트 디버깅만 할 수 있었고, 하나의 V8 가상 머신에서만 동작했었습니다. 사실 하나의 구글 크롬 인스턴스에는 렌더링 프로세스에 따라 한 개 이상의 V8 가상 머신이 존재할 수 있습니다. 게다가 브라우저 탭에서 URL을 가져오거나 DOM 트리를 탐색하고 수정하는 작업은 자바스크립트 만으로는 다룰 수 없습니다.
이러한 제약때문에 원격 디버거와 디버깅되는 프로세스간에 추가 정보를 주고받을 수 있는 크롬 개발툴 프로토콜을 만들었습니다. 크롬 개발툴 프로토콜은 현재의 V8 디버거 프로토콜을 비롯한 다른 디버깅 관련 프로토콜의 전송 수단으로도 사용할 수 있습니다.
이 프로토콜을 사용해서 만든 도구 중 하나가 바로 이클립스 기반의 디버거입니다.
원격 디버거에 대한 노력은 그 밖에도 많이 있습니다. 한가지 예로, 오페라 드래곤플라이의 디버깅 및 검사 아키텍쳐인 스코프 인터페이스를 들 수 있습니다. 파이어버그 역시 웹 디버그 프로토콜을 가지고 있으며, ActiveState 에서 사용하던 전통있는 DBGP도 있습니다.

from Google Chrome Eclipse Debugger

Posted by 행복한고니 트랙백 0 : 댓글 0

댓글을 달아 주세요

Microsoft의 Sameer Chabungbam씨가 아래 기능을 포함하고 있는 새로운 JScript 프로파일러에 대한 글을 작성하셨습니다:
  • JScript 함수의 성능 데이터를 두가지 방법으로 제공
    • 함수 View  - 모든 함수의 비계층적 목록
    • 호출 트리 View - 호출 흐름에 기반한 함수의 계층적 목록
  • 데이터를 파일로 내보내는 기능 지원
  • 익명 함수를 위해 추측된 이름 제공
  • 내장 JScript 함수 프로파일링
  • 다중 프로파일 보고서 지원
  • 페이지 탐색과 리프레시에 걸친 프로파일링 지원
사용자 삽입 이미지

한편 Eric Pascarello씨는 새로운 도구를 찾아  구글 크롬 디버거에 대한 자신의 경험을 글로 작성했습니다. 그는 다양한 명령어와 중단점 기능에 대해 상세히 기술했습니다.

from New Profilers and Debuggers in Google Chrome and IE
Posted by 행복한고니 트랙백 0 : 댓글 0

댓글을 달아 주세요

사용자 삽입 이미지
Opera에서 새로운 멋진 웹 디버깅 툴 Opera Dragonfly가 알파버전으로 릴리스 됐다고 합니다.

JavaScript 디버깅, CSS와 DOM 조사(inspect), 에러 보기 - Opera Dragonfly는 Opera를 사용한 개발을 컴퓨터나 모바일 전화기에서나 한층 쉽게 만들어줍니다.

Shawn Lauriat씨가 관련된 이야기에 대해 글을 썼습니다.

기능

  • 단계별 중단점 설정: Opera Dragonfly의 풍부한 기능을 갖춘 JavaScript 디버거는 복잡한 Ajax 응용프로그램을 보다 쉽게 작성하도록 합니다. 코드를 줄 단위로 실행하며, 중단점을 설정할 수 있습니다. 이를 이용해 설계한 대로 스크립트가 잘 동작하는지 확인할 수 있습니다.
  • 스타일 재정의: 조사할 수 있는 것은 DOM 만이 아닙니다. 엘리먼트에 어떤 CSS가 적용되었는지, 무엇을 상속받았는지 혹은 브라우저에 의해 기본값으로 설정된 것은 무엇인지 확인할 수 있습니다. 재정의된 규칙은 강조되므로 어떤 스타일이 적용되고 어떤 스타일이 적용되지 않았는지 알 수 있습니다. CSS 규칙 편집 기능은 다음 버전에서 추가될 것입니다.
  • 에러 검출: 개선된 오류 콘솔은 스크립트에서 발생한 오류 기록을 보거나 필터링 할 수 있으며, 에러가 발생한 정확한 위치를 가리킵니다. 사이트의 버그를 찾아내고 수정하는데 다른 툴과 이를 조합해서 사용하세요.
  • DOM 디버깅: 소스 보기는 DOM을 대체하는 DOM스크립팅을 사용할 때 유용하지 않습니다. Opera Dragonfly는 업데이트된 DOM 및 모든 프로퍼티를 조사할 수 있습니다. DOM 편집 기능은 다음 버전에서 추가될 것입니다.

몇몇 기능들은 아직 포함되지 않았으나 곧 포함될 예정입니다. 이를 테면, CSS, JavaScript, DOM 편집 지원, 단일창 모드, 개선된 JavaScript 스레드 핸들링, XHR과 HTTP 모니터링, 개선된 키보드 네비게이션, 여러 언어로 번역 등이 있습니다.

Firebug는 이제 웹 브라우저 디버거들의 기준이 되어버린 느낌입니다. 무료로 사용할 수 있는 Firebug 수준의 디버거들이 여러 브라우저에서 늘어나기만 한다면 정말 대환영일 것 같습니다. Dragonfly가 제 역할을 해준다면 이제 사파리하고 IE만 남았군요.

from Opera Dragonfly : New Web Tooling on Ajaxian
Posted by 행복한고니 트랙백 0 : 댓글 0

댓글을 달아 주세요

iPhone 원격 디버거

2008. 4. 24. 00:38 from [IT] Web Tech

Jon Brisbin씨는 iPhone 개발을 하는 Java 개발자인데, 보다 나은 iPhone 원격 디버거가 필요한 가려움증을 스스로 해결하기로 하고 iPhoneDebug를 만들었습니다:

iPhone Debug Consle 은 개발 중에 iPhone/iPod Touch 을 더 잘 보고 더 잘 동작해보기 위해 만들어졌습니다. 저는 "console.log 구문을 넣은 뒤에 리로드"해야 하는 디버깅 방법에 좌절하고 있었습니다. 저는 Firebug의 콘솔과 디버거 같이 끝내주는 무엇을 원했습니다.

페이지와 상호연동할 방법이 없었기 때문에 iPhone/iPod Touch 응용프로그램을 디버깅하려는 저의 노력은 점점 실패로 느껴졌습니다. console.log 구문을 넣고 페이지를 리로드 하기 전에는 변수값과 CSS 값을 얻어낼 수도 없었습니다. 이건 아니다 싶었습니다.

제가 필요로 하는 것을 찾던 중에, Joe Hewitt씨의 iPhone/Firebug 통합본을 보게 되었습니다. 하지만, 저는 데스크탑 브라우저에서 firebug나 "console.log" 없이도 동작할 수 있는 보다 굳건한 무엇을 원했습니다.

Java 개발자인 저는, 자연스럽게 데스크탑 브라우저와 iPhone간의 메시지 전달을 위해 COMET과 Jetty의 이용을 고려하게 되었습니다. 며칠이 지난 뒤에, 실행가능한 해결책이 나왔습니다. 그것은 모바일 JavaScript의 것을 데스크탑 콘솔에 기록할 수 있었는데, 제 경우에 있어 가장 큰 이점은 결과를 제 데스크탑 콘솔로 받으면서 iPhone에서 실행할 JavaScript를 보낼 수 있었다는 것입니다. Firebug와 마찬가지로, 메소드를 호출하고 CSS 값을 가져오고, Firebug로 응용프로그램을 작성할 때 사용했었던 디버깅 방법들이 모두 가능합니다.

아래가 실제로 동작하는 화면입니다:

Issuing Commands in ipd Console

Issuing Commands in ipd Console


from iPhone Remote Debugger on Ajaxian
Posted by 행복한고니 트랙백 0 : 댓글 0

댓글을 달아 주세요