Syntax - Tasty Web Development Treats

Dev Tools Tabs Explained — Plus Tips & Tricks

Apr 14, 2021
Discover the ins and outs of browser DevTools as the hosts unveil each tab's secrets. They joke about improving coding performance and optimizing API loads while revealing cache management techniques. Dive into communication solutions that enhance user interaction, and learn how to master memory leaks and performance metrics. Exciting discussions on color contrast in web design and hidden features of Chrome's developer tools round out the session. Plus, enjoy a fun detour into coffee making and personal anecdotes!
Ask episode
AI Snips
Chapters
Transcript
Episode notes
ADVICE

Network Tab Usage

  • Use the Network tab to see all requests and disable caching for accurate debugging.
  • View timing, GZIP size, and identify blocked requests or analytics tracking.
ADVICE

Cache Busting

  • After deploying, close DevTools and bust cache for users by appending a version query to assets.
  • Use query parameters or hashes to force browsers to download new assets instead of using cached versions.
ADVICE

Debugging and Unofficial APIs

  • Debug network requests and utilize unofficial APIs by inspecting network activity, copying as fetch or cURL.
  • Delete unnecessary parts of the copied request until it breaks, then restore the last removed part.
Get the Snipd Podcast app to discover more snips from this episode
Get the app