Your SlideShare is downloading. ×
0
모바일 디버깅
모바일 디버깅
모바일 디버깅
모바일 디버깅
모바일 디버깅
모바일 디버깅
모바일 디버깅
모바일 디버깅
모바일 디버깅
모바일 디버깅
모바일 디버깅
모바일 디버깅
모바일 디버깅
모바일 디버깅
모바일 디버깅
모바일 디버깅
모바일 디버깅
모바일 디버깅
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

모바일 디버깅

1,453

Published on

Published in: Technology
0 Comments
10 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,453
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
12
Comments
0
Likes
10
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. 모바일 웹 디버깅 도구 전용우
  • 2. 5년 전 Desktop 상황.
  • 3. 모바일에서 모든걸 디버깅?
  • 4. Mobile Desktop
  • 5. Desktop• 디버깅 환경이 좋음.• 쉽게 개발할 수 있음.• 모바일 상황에 특화된 버그가 아닌 경우.
  • 6. Chrome Developer Tool• Agent 변경• Rotate 가능• Touch이벤트 Emulate• 실험 기능 – Override Geolocation – Override Device Orientaion
  • 7. Mobile• 일부 제약적인 환경의 브라우저를 제외하 고는 디버깅 환경이 열악함.• 모든 브라우저와 환경에 적합한 디버깅 도 구는 없고 상황에 맞게 사용.
  • 8. 일부 환경• iOS6 + Mountain Lion – Mobile Safari (링크)• Android 4.0(Ice Cream Sandwich) – Mobile Chrome (링크)• Android 2.2(Froyo) – Mobile Firefox (링크)• Mobile Opera – (링크)
  • 9. 브라우저 점유율(추정) 3% 4% 11% 6% Safari 6 Safari 5 24% Android 4.x Android 3.x Andorid 2.3 Andorid 2.2 Andorid 2.150% 2% http://gs.statcounter.com/#mobile_os-KR-monthly-201109-201209 http://developer.android.com/about/dashboards/index.html http://tctechcrunch2011.files.wordpress.com/2012/10/1005_ios6update.png
  • 10. 브라우저 점유율(추정) + 6% 94%
  • 11. 현실은 아직 삽질 http://www.flickr.com/photos/steelmore/265678915/
  • 12. 간단한 로그를 확인할 때.• jsconsole(링크) – 간단하게 로깅하고 스크립트를 실행함. – 장점 • 스크립트만 삽입하면 사용 가능. – 단점 • 복잡한 스크립트 실행이나 엘리먼트 확인이 안됨.• 간단히 직접 구현해서 사용.
  • 13. #1. 추가 기능을 쓰고 싶을 때• wenire(링크) – 데스크탑의 일부 기능을 제공하는 디버거 – 엘리먼트 디버깅 / 콘솔 기능 사용 리소스/네트워크/타임라인 탭의 일부 기능 – 장점 • 데스크탑과 유사한 기능을 제공 • 모바일 디버깅 도구 중 가장 유용 – 단점 • 서버를 실행해야 하는 등 좀 불편함. • 스크립트 디버깅이 안됨.
  • 14. #2. 추가 기능을 쓰고 싶을 때• Adobe Edge Inspect(구 Shadow)(링크) – wenire을 좀 더 쉽게 사용할 수 있음. – wenire 이외에 다양한 기능들이 있음. – 장점 • 한번 설정하면 쉽게 바로 사용가능 – 단점 • webview에서 실행하기 때문에 실제 브라우저라고 할 수 없음.
  • 15. 스크립트 디버깅• Aardwolf(링크) – 스크립트에 breakpoint를 설정하고 조절. – instrument code을 삽입하여 실행. – 장점 • breakpoint를 설정 가능한 유일한 도구. • callstack등 데스크탑 스크립트 디버깅와 유사. – 단점 • 매우 불안정하여 실제로 사용하기는 아직 적합하지 않음
  • 16. ETC• Fiddler을 이용한 디버깅(링크)• 모바일 성능 측정 mobitest(링크)
  • 17. 미래?• Webkit Remote Debugging Protocol(링크) – Blackberry debugger(링크) – Chome for Android(링크)• Firefox Remote Debugging Protocol(링크) – Firefox for Android(링크)
  • 18. 감사합니다.

×