Chrome's developer tools are a competitive advantage

about | archive

[ 2014-March-20 12:06 ]

Working on Mitro means I'm doing more web development then I've done in a decade. Since Mitro is a browser extension that supports Safari, Firefox, and Chrome, I've been exposed to the less widely used parts of these browsers. It turns out that Chrome's developer tools are clearly better. For example, Chrome's debugger and inspector work flawlessly with extension background pages, content scripts, and even inside web workers. The network request and performance timeline are very useful once you learn how they work. As a whole, Chrome has given me a renewed appreciation for the value of a good debugger. It made me realize that good developer tools are a competitive advantage for platforms like web browsers. Developers tend to use Chrome, because it makes their job easier. As a result, web sites work best in Chrome, and this encourages users to switch. This is similar to Microsoft's strategy around Visual Studio: make tools for internal use, but mostly to encourage others to build Windows apps.

As a bonus example (partly so I can find it again): If you need to fix a web page performance issue, read Chrome's performance profiling documentation, which is surprisingly excellent. In particular, I recently was very successful at tweaking a page by looking for forced synchronous layouts. Basically we had a page with weird rendering at load time, and by figuring out what was causing forced layouts, and rearranging the code so they were grouped together, we were able to make it significantly better. Other useful resources are this Performance Audit Workflow and Runtime Performance Checklist.