Tagged articles
13 articles
Page 1 of 1
JD Tech Talk
JD Tech Talk
Feb 28, 2025 · Frontend Development

Understanding Chrome DevTools, the CDP Protocol, and Building Custom Debugging Tools

This article explains the components and principles of Chrome DevTools, provides a detailed overview of the Chrome DevTools Protocol (CDP) and its workflow, and guides readers through creating custom debugging tools for platforms such as Android WebView, Roma, and Harmony, highlighting technical challenges and implementation steps.

CDPChrome DevToolscustom debugging
0 likes · 11 min read
Understanding Chrome DevTools, the CDP Protocol, and Building Custom Debugging Tools
Huolala Tech
Huolala Tech
Jun 6, 2023 · Frontend Development

How PageSpy Recreates Chrome DevTools Console for Remote Web Debugging

This article explains PageSpy’s design and implementation for a remote web debugging console that mirrors Chrome DevTools, detailing how it handles complex objects, serialization challenges, getters, self‑references, and prototype‑chain inspection using a custom Atom data model.

JavaScriptPageSpyfrontend tools
0 likes · 8 min read
How PageSpy Recreates Chrome DevTools Console for Remote Web Debugging
FunTester
FunTester
Nov 20, 2022 · Fundamentals

Decoding Wireshark: How TCP/IP Layers Shape HTTP Traffic

This article explains how Wireshark captures map to the TCP/IP four‑layer model, walks through Ethernet, IP, TCP/UDP, and application layers, and demonstrates detailed HTTP request‑response analysis using Wireshark, HttpWatch, and browser developer tools.

HTTPPacket CaptureTCP/IP
0 likes · 9 min read
Decoding Wireshark: How TCP/IP Layers Shape HTTP Traffic
21CTO
21CTO
Jun 12, 2022 · Frontend Development

Master Chrome DevTools: Edit, Debug, and Override Any Web Page Efficiently

This comprehensive guide walks developers through Chrome DevTools' powerful editing, debugging, and override features—including quick CSS/JS tweaks, workspace setup, console utilities, breakpoint strategies, and even Node.js/Deno debugging—empowering efficient front‑end development without leaving the browser.

Chrome DevToolsNode.js DebuggingOverrides
0 likes · 11 min read
Master Chrome DevTools: Edit, Debug, and Override Any Web Page Efficiently
vivo Internet Technology
vivo Internet Technology
Dec 22, 2021 · Frontend Development

In-Depth Analysis of Chrome DevTools Architecture, Protocols, and Performance Tools

The article offers a thorough technical examination of Chrome DevTools’s client‑server architecture, the JSON‑based Chrome DevTools Protocol, and performance tooling within Android Chromium 87, guiding front‑end developers and engineers through its history, core implementation, code examples, JavaScript evaluation, performance diagnostics, and broader ecosystem impact.

AndroidCDPChrome DevTools
0 likes · 27 min read
In-Depth Analysis of Chrome DevTools Architecture, Protocols, and Performance Tools
WeDoctor Frontend Technology
WeDoctor Frontend Technology
Aug 10, 2020 · Frontend Development

Master Web Debugging with Whistle: A Frontend Engineer’s Guide

This guide explains why a flexible proxy tool like Whistle is essential for frontend development, covering its features, installation, configuration, HTTPS handling, matching rules, and common use‑cases such as host binding, request/response replacement, script injection, remote console, and Weinre integration.

HTTPSNodeWhistle
0 likes · 18 min read
Master Web Debugging with Whistle: A Frontend Engineer’s Guide
FunTester
FunTester
Aug 7, 2020 · Industry Insights

Is Fiddler Everywhere the Future of Web Debugging?

Fiddler Everywhere is a cross‑platform web debugging proxy that merges Fiddler and Postman features, offering a modern UI for capturing, editing, and replaying HTTP(S) traffic, though its free version limits sharing and some functionalities are still maturing.

FiddlerHTTPPostman
0 likes · 4 min read
Is Fiddler Everywhere the Future of Web Debugging?
Aotu Lab
Aotu Lab
Sep 15, 2017 · Backend Development

Master Whistle: A Node‑Based Web Debugging Proxy for Developers

This guide introduces Whistle, a Node‑powered cross‑platform web debugging proxy, explains installation, core features, common usage patterns, and advanced mock data techniques, helping developers replace tools like Fiddler or Charles with a more flexible solution.

HTTP interceptionNode.jsProxy
0 likes · 10 min read
Master Whistle: A Node‑Based Web Debugging Proxy for Developers