Syntax - Tasty Web Development Treats How to Get Better at Debugging
17 snips
May 23, 2018 Dive into the art of debugging with tips for reading stack traces like a treasure map. Discover how to avoid pitfalls of debugging in production and learn to inspect network responses for those tricky CORS errors. Get hands-on with breakpoints and console methods to streamline your process. Take a step back, talk it out with a 'rubber duck,' or isolate issues in CodePen. Plus, explore advanced DevTools for profiling and browser-specific troubleshooting. Whether debugging client-side or server-side, these strategies will sharpen your skills!
AI Snips
Chapters
Transcript
Episode notes
Read The Stack Trace First
- Read the stack trace carefully and focus on the first few lines to find where the error actually happened.
- Use the stack trace as a treasure map of function calls to pinpoint the failing file and line.
Don't Debug Cached Or Production Builds
- Avoid debugging a cached or production build; confirm you’re running the correct local environment and clear caches like Cloudflare when needed.
- Check you're not accidentally viewing an old deployed version before assuming code is broken.
Check The Network Panel For Full Responses
- Inspect failed network requests in the Network panel to view full responses, timing, and error messages for APIs or images.
- If the response exists but your JS can't access it, look for CORS issues and access-control headers.