Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Und es geht doch! Tools und Debugging für JavaS...

Ingo Rammer
March 06, 2014
120

Und es geht doch! Tools und Debugging für JavaScripter

Ingo Rammer

March 06, 2014
Tweet

More Decks by Ingo Rammer

Transcript

  1. Ingo Rammer • Gründer und technischer Consultant der Thinktecture AG

    • Mein Fokus – Unterstützung von Entwickler von verteilten, mobile Business- Anwendungen – HTML5/JavaScript auf Windows, iOS, Android – Interoperabilität von HTML5 mit nativem Code auf allen Plattformen @ingorammer [email protected] http://www.thinktecture.com Slides: https://speakerdeck.com/ingorammer think mobile!
  2. Transfer-Optimierung • Resource Combination mit ASP.NET MVC • Aber wichtig:

    Minification für Enterprise Apps evtl. nicht notwendig – evtl nur "Concatenation"
  3. Debugging • Debugging Tools & Commands (console …) – IE

    mit Visual Studio – Chrome mit WebStorm – Chrome alleine • Debugging auf Gerät ("Remote Debugging“) – Chrome – Safari • Generell – Reload-bei-F5! (URL vs. impliziter Status) – Live-Style Editing (Chrome Workspaces)
  4. Console/Chrome • Breakpoints – DOM Modifications – Exceptions – Event

    Listeners • Device Emulation • Storage-Explorer • Pretty-Print JavaScript
  5. Console/Chrome • Console – console.log(), .warn(), .error() – console.trace() ->

    stacktrace – console.dir() – console.time("xyz"),.timeEnd("xyz") – console.timeStamp() -> Timeline Ansicht – console.group("foo"), .groupEnd("foo") – Rechter Mausklick -> "Filter", Preserve Log • Timeline – CPU – Speicher • Angular-Addin ("AngularJS Batarang")
  6. Communication • Chrome XHR Tracing – Rechtsklick  "Export as

    HAR with Content" – HAR-Viewer (code.google.com/p/harviewer) • Fiddler (Windows) oder Charles (Mac) – Kann HARs importieren! • PostMan für REST-Debugging
  7. Unit Testing • Jasmine (Tests, Fakes, Spys und Mocks) •

    Karma (Test runner) • Protractor • Mocha