JSFoo 2015

The talk will cover the latest on the Chrome DevTools. The audience can expect an introduction to its the toolset with the help of near real life examples. More specifically, look forward to

• Understanding how to check your app for memory leaks and find out if your app needs memory optimizations.
• How to create your own Chrome DevTools extension and customize it?
• Understanding how you can debug faster. The latest advancements in the Debugger allow it to be used to control the flow of more than just scripts.

Outline

The DevTools offer a set of powerful debugging and analysis tools to developers by enabling access to the internals of web pages. While most of us use the browser tools on a day to day basis for styling or basic script debugging, the Chrome DevTools offer much more than just this.
I came across such use of DevTools on a previous project where they helped us in solving a major memory leak due to recurring event bindings. From then on, the DevTools have only gotten powerful and now it is paramount that we incorporate their use in our everyday development process.
Some insights about the talk:

• The talk will be in the form of small examples each corresponding to common problems faced when building front end heavy web applications. Taking each example, the idea would be to apply the available DevTools and see how they allow us to detect and, pin point the source of, performance bottlenecks.
• The talk will discuss the usage of some powerful debugging techniques enabled by the DevTools like Memory snapshot comparisons or the Object allocation tracker.
• Some popular extensions for the Chrome DevTools.

Requirements

Prior experience working with a JavaScript Console/DevTools would be recommended.

Speaker bio

Manan is a full stack developer at ThoughtWorks. While he has experience working with various backend technologies including languages like Ruby, Java, he is quite fond of JavaScript on the front end. He places a strong emphasis on writing better JavaScript code ensuring quality through the use of modern day testing tools including libraries like Jasmine, Mocha, Sinon etc.
Manan firmly believes that non performant JavaScript has an adverse effect on the success of an application and likes to keep up to date with tools and practices that enable better performance.

Links

• Optimizing JS Apps to increase performance - https://www.youtube.com/watch?v=bwiPPywbpEg
• Offline in the browser- with IndexedDB, AppCache & LocalStorage - https://www.youtube.com/watch?v=3vXMNsCJ5Yw
• https://speakerdeck.com/manan
• https://github.com/mananbharara

Slides

https://speakerdeck.com/manan/needle-in-a-haystack-advanced-devtools-usage