We can't find the internet
Attempting to reconnect
Something went wrong!
Hang in there while we get back on track
Modern Web Debugging – Jecelyn Yeen, JSNation 2023
Improve your web debugging experience with expert Jecelyn Yeen, as she shares game-changing tools for Chrome DevTools, making code inspection easier and more effective.
- DevTools 15 years ago only showed a big chunk of the file, making it hard to debug
- Modern Web Debugging: Jecelyn Yeen shares tools to improve debugging experience
- Chrome DevTools team wants to improve debugging experience by standardizing source maps
-
Tools discussed:
- Conditional Breakpoint: set Breakpoint only when certain conditions are met
- Log Point: like console.log but without the need for console.log
- JavaScript snippet: copy and paste into DevTools to make debugging easier
- Source maps: use to map compressed code back to original sources
- Breakpoint panel: group Breakpoints by files and authors, with options to ignore files
- Web applications: developers used to code in HTML, CSS, and JavaScript
- Debugging: tools and frameworks have changed, but debugging is still necessary
- Productivity: Jecelyn suggests using command click to set Breakpoints, JavaScript snippets, and Configure option to ignore files