Your SlideShare is downloading. ×
0
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
Web Developer Tools for ICOS 2013
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

Web Developer Tools for ICOS 2013

827

Published on

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

No Downloads
Views
Total Views
827
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
21
Comments
0
Likes
2
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. 現代網⾴頁開發⼯工具othree @ ICOS 2013
  • 2. me• othree• Twitter, Plurk, flickr, Github• Blog: https://blog.othree.net• F2E at HTC
  • 3. 過去
  • 4. How DevelopersDebugging
  • 5. Problems• 只有 script 除錯功能• 錯誤訊息難以辨識
  • 6. The Most PowerfulDebugging Function
  • 7. alert
  • 8. 現在
  • 9. Text
  • 10. Rich InternetApplications
  • 11. HTML5/Web APIsWebSockets,Web Storage,IndexedDB, Server-Sent Event...
  • 12. How?
  • 13. 2004
  • 14. Take Back the Web
  • 15. 2007
  • 16. Firebug• 第⼀一個現代的網⾴頁開發⼯工具• by Joe Hewitt
  • 17. Modern Dev ToolFunctions• 查看 DOM Tree / 樣式• 有意義的錯誤訊息• 監看網路連線• 效能調校• Browser Object Model 存取
  • 18. Modern Dev Tools• Firebug for Firefox• Developer Tool for Chrome/Safari• Dragonfly for Opera
  • 19. Demo Time
  • 20. One More Thing
  • 21. Firebug Lite
  • 22. Firebug Lite• Bookmarklet• 不限定瀏覽器• DOM 檢視器• console
  • 23. Further Reading
  • 24. Improving Web App Performance With the ChromeDevTools Timeline and Profiles
  • 25. Using the Heap Profiler in Chrome Dev Tools
  • 26. My Workflow: Never having to leave DevTools
  • 27. Documents• Console API• Command Line API• Chrome Developer Tools• Opera Dragonfly Documentation
  • 28. Questions?http://www.flickr.com/photos/roman/5610736/

×