Chrome & Firefox DevTools. HTTP Protocols & WebSockets

• ChromeDevTools
• Firefox DevTools
• Other Tools
• HTTP Protocols
  • HTTP Status Codes
  • HTTP/2
  • HTTP/3
  • HTTP Structured Fields
• Tweets

ChromeDevTools

• devtools.chrome.com
• Port of Firefox’s JSON Viewer
• twitter.com/ChromeDevTools
• In @ChromeDevTools Network, the Copy menu is powerful for replaying network requests. Copy as Fetch API code, cURL and a Node.js fetch that includes cookie data:
• digitalocean.com: How To Debug Node.js with the Built-In Debugger and Chrome DevTools
• dev.to: My 12 Favorite Chrome Extensions as a Web Developer
• blog.bitsrc.io: Google Chrome Hidden Features Every Developer Should Know

Firefox DevTools

• Firefox DevTools
• Tip: Firefox has a really nice JSON viewer built in. Transforms JSON files (and API responses) into an easy to browse & search tree.

Other Tools

• jsontoolbox.com

HTTP Protocols

• wizardzines.com: Request Headers
• wizardzines.com: Response Headers

HTTP Status Codes

• wikipedia: List of HTTP status codes
• slideshare: Http Status Code Errors in SEO
• http.cat 🌟

HTTP/2

• Wikipedia: HTTP/2
• SPDY & HTTP 2 with Akamai CTO Guy Podjarny
  • cURL mantainer: http2 explained 🌟
  • cURL mantainer: curl and HTTP/2 by default
  • cURL mantainer: A 2015 retrosprective
  • http2.github.io HTTP/2 🌟
  • http2.github.io HTTP/2 Frequently Asked Questions 🌟
  • HTTP/2 resources
  • A Simple Performance Comparison of HTTPS, SPDY and HTTP/2 🌟
  • blog.cloudflare.com - Tools for debugging, testing and using HTTP/2
  • blog.cloudflare.com - HTTP/2 For Web Developers
• HTTP/2 With JBoss EAP 7 - Tech Preview
  • Dzone - HTTP/2 With JBoss EAP 7: Tech Preview
• simple-talk.com: Script Loading between HTTP/1.1 and HTTP/2
• 5 Tips to Boost the Performance of Your Apache Web Server
• DZone: How HTTP/2 Is Changing Web Performance Best Practices For people who write code for the web, transitioning to HTTP/2 isn’t always straightforward, and a speed boost isn’t automatically guaranteed. This article is an introduction to HTTP/2 and how it changes web performance best practices.

HTTP/3

• Wikipedia: HTTP/3

HTTP Structured Fields

• Improving HTTP with structured header fields 🌟
• http-sfv: HTTP Structured Field Values in Python

Tweets

Click to expand!

❤️ the Performance Monitor in @ChromeDevTools. Gives you a real-time view of CPU use, JS heap size, JS event listeners, style recalcs & more: https://t.co/tc6CyTya3O pic.twitter.com/BWSi8klGkE

— Addy Osmani (@addyosmani) July 7, 2020

8 Google extensions every developer must use

A thread 🧵🧵

— Meet Jain🦅 (@meetjain74) September 5, 2021

💡 Web Development tip

You can restart Chrome from the address bar by typing: chrome://restart pic.twitter.com/0jbVoHwS1z

— Csaba Kissi ⚡ (@csaba_kissi) November 7, 2021

Copy link to highlight is a new Chrome feature that allows you to create links to the exact part of a web page you want to share. https://t.co/IS0jijOjvP pic.twitter.com/L9q2abGQMd

— Kelsey Hightower (@kelseyhightower) November 20, 2021