Debug in safari

  • 2,633 views
Uploaded on

HTML5とか勉強会#37 @nakajmg

HTML5とか勉強会#37 @nakajmg

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
2,633
On Slideshare
0
From Embeds
0
Number of Embeds
5

Actions

Shares
Downloads
9
Comments
0
Likes
8

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. Debug in Safari HTML5 ¶ÊVv #37 2013/03/21
  • 2. PÊžv «Ìhtml5j / HTML5 ôáÜÕ¶ V ¡—–öçßý {—∼ @nakajmg ¼êÔ Ãè Ãç ô CSS/JavaScript/HTML5
  • 3. Safari 6
  • 4. ¬̃ oo” Safarioȶxq” devtools zo³¶O©Qfiº¶OÝ ÂÔ¼
  • 5. Safari v¡—–›³ ?
  • 6. ËáÂÞ•ÎýÚ³ß™êŸ oØ •ßïß™êŸÍ " " pí 1 È > Safari > ýڔߣ™%êŸoØ
  • 7. ß ™êŸoØ
  • 8. devtools UI qÈögw
  • 9. z¢” ìðÅ
  • 10. ßïè¾Ñ ÓßÎòé
  • 11. ïè¾Ñ ÓßÎòé ß ßÉçáÇçß ÓCtrl + 0 : ýÚø ýÚ”ßïè¾Ñ /Ctrl + 1 : ÕßÚCtrl + 2 :Ôß çÕCtrl + 3 :¾ Š¾ÜCtrl + 4 : ›{Ctrl + 5 : tCtrl + 6 : ÌáïåCtrl + 7 : ç ¾ýËß õCtrl + 8 : Ì (Chrome » cmd + 1~ )
  • 12. ßÒÁ õç ä Ï
  • 13. ßïè¾ÑÖ ßä½å
  • 14. Æ( ßÉž ™ 0.1 Option + / Æ( ßÉž ™ 10 Shiht + / Æ( ßÉž ™ / 1¦zòN”߶flU zu–›− òN” ¾ÜÕ
  • 15. ïè¾ÑÖ ßä½å ß ßÉçáÇçß ÓCtrl + Shift + 0 : ýÚø ýÚ”ßïè¾Ñì /Ctrl + Shift + 1 : pŽ”ÕßÚCtrl + Shift + 2 : pŽ”èßíCtrl + Shift + 3 : pŽ” ¾ÜÕ
  • 16. UserAgent òN”
  • 17. : Safari Realized −¡òN³çÕ ”ç ÂÔßÃßÒßž”ß™êŸoØ Safari ç¾Ñ ̨ ç ÂÔßÃÒßž oØ >
  • 18. ∼œ »zo³¶O©Q devtools ∙¦−m»oÈ” UI
  • 19. devtools ¬̃ qÈzxq
  • 20. o¶x wjQ” ¾¹ô JS/CSS
  • 21. o¶|wßÇáóß Ç
  • 22. o¶x wØ]” ¤© JS minify
  • 23. o¶x çß ™ÿÃ wç ù¾touch
  • 24. touch õ¾ −x çß ™ÿÃwç ù¾ phantom-limb https://github.com/brian-c/phantom-limb çá ËßþËáõ
  • 25. Ìï
  • 26. Oú¹»•Ìáïå” JS− Öw • −mwéŸ
  • 27. ”oo –Q̃∙ç ¾ýËß õ
  • 28. R vqøÆ–›ºv v mac t −©¢w • ÜËúÕ ¾ ” : web Web Safari6 ý¬uT 1 qł|—|žœ¤– Öw • ”ÜËúÕ ¾ : Web ç¾Ñ ̨ ¡—£ž |V” CSS
  • 29. Safari ¬̃ oo”
  • 30. ܽåÃçáúêÕ
  • 31. ýڳܽåÃçáúêÕ oØ >−x ß html Üw½™òÃöŠáÜ êÕ å ç ¾ ú¼ ”
  • 32. Ìáïåçߎ
  • 33. iOS −x wÌáïå”Ï̊ Safari6 + iOS6
  • 34. −¡• ų ÜËúÕ ¾ Web pí 1Ł Ï̊ > Safari > : iOS−¡•ÒE³Ìáïåçߎ
  • 35. ̆Ó³Õ¾ïåœv oØ ž Mac : zس Ï̊ : Safari ž iOS−}¶fi ³ Ï̊ Mac USB iOS
  • 36. Üß ™ÿÓ iOS
  • 37. flUþ• ÎýÚ
  • 38. −̊Ów Ôßï Õ¾ïå
  • 39. Î Üß ™ÿÓ•Ú” Î̀−©„wçá Ó ß ËÕ Ûw ÎýÚ
  • 40. ß™êŸoØ”fiÑqØ
  • 41. ¾ è þÏž ždefaults write com.apple.Safari IncludeInternalDebugMenu 1
  • 42. Debug ™êŸß
  • 43. Caches Window
  • 44. Miscellaneous Flags chrome://flags fiº¶O
  • 45. Drawing/Compositing Flags GPU ”÷9flag
  • 46. Compositing BordersDrawing/Compositing Flags > Show Compositing Borders GPU ýÚ”É̌È”«Þ−ø• −©ýÚwc‚&ò”«Þ
  • 47. …∙¶∙¶¥Š Ò+ôÑ”Õ× ö vv” alert Ø•H
  • 48. flUÜß ™ÿÓ iOS ÂÊ»•Ìáïå”Ï̊ iOSŸÕÕÅwÒÁ õ Ì JS/CSS Ł”H»—áïå”
  • 49. ß°u