A web app for teaching people about Chrome DevTools.
git clone https://github.com/jkup/mastering-chrome-devtools.git
cd mastering-chrome-devtools
npm install
node server.js
This site is designed as teaching aid for my "Mastering Chrome DevTools" workshops but I hope it will stand fine on its own.
The workshop is divided into multiple sections:
- Editing - Changing styles and markup and persisting those changes to disk
- Debugging - Using the step-through debugger to fix a buggy program
- Profiling - Audit a slow page. Run a JavaScript CPU profile and figure out what's causing slowness.
- Timing - See how long each function on your sites takes and figure out which one is the longest!
- Page Jank - Try to identify page jank without tooling. Then use the DevTools to fix it!
- Memory Leaks - Learn about the common causes of JS memory leaks. Then find the one on the page and fix it!