问题
I casually use Chrome developer tools for debugging AJAX & JavaScript. Mostly that means the console to check on element/variable/method state, occasionally 'network' tab to debug issues fed through ajax, very occasionally break points in debugger if I can't hunt down a JS bug.
But any time a dedicated front-end developer (I'm back end) uses the same tools in front of me, they use these nifty & abstract little features that always leave me thinking "damn, why didn't I know about that"?
...So, the question is: Any suggestions for resources that provide a thorough & more advanced explanation of google chrome devtools?
回答1:
Addy Osmani did an excellent series on the chrome dev tools, you can find some of it here. I think that if you read it (and watch the videos), I've found them very useful, if you read them, you're pretty much covered. I included some additional useful resources.
Addy Osmani Tutorials and videos:
- Easy memory profiling using the chrome dev tools
- Visually re-engineering css for faster paint times
- The Breakpoint - Chrome dev tools (Youtube video)
- The Breakpoint Ep2 (Youtube video with Paul Irish)
- The Breakpoint Ep3 (Youtube video, source maps)
- Chrome devtools course by TutsPlus (subscription required)
Official:
- Developer tools official guide by Google
- Google video tutorials on the developer tools by Google
- Profiling JavaScript by Google
Other:
- Nettuts series , fairly basic but nicely put.
- A re-introduction to the dev tools by Paul Irish
- Smashing Magazine also did an article on profiling, but it's fairly basic compared to the Addy Osmani stuff.
回答2:
Here is another basic one from Code School, including some tasks after each lesson to practice: http://discover-devtools.codeschool.com/
回答3:
I've found this Google Chrome Devtools cheatsheet very useful: http://anti-code.com/devtools-cheatsheet/. Also, this interactive course teaches you how to master Chrome DevTools.
来源：https://stackoverflow.com/questions/16752622/chrome-developer-tools-best-resource-for-learning-advanced-features