Tag

Chrome DevTools Protocol

0 views collected around this technical thread.

Code Mala Tang
Code Mala Tang
Jul 18, 2024 · Backend Development

Master Node.js Debugging with VS Code: A Complete Guide

This tutorial explains the fundamentals of Node.js debugging, covering V8 and Chrome DevTools Protocol basics, step‑by‑step CDP usage, built‑in debugger commands, and detailed VS Code configuration to help developers efficiently locate and fix issues.

Chrome DevTools ProtocolJavaScriptNode.js
0 likes · 17 min read
Master Node.js Debugging with VS Code: A Complete Guide
ByteFE
ByteFE
Dec 21, 2022 · Frontend Development

Evolution and Best Practices of Remote Debugging for Mobile and Hybrid Web Applications

This article comprehensively explores the evolution, underlying principles, and practical implementations of remote debugging for mobile and hybrid web applications, comparing historical tools like Weinre with modern solutions, analyzing USB and Wi-Fi transport mechanisms for Android and iOS, and providing actionable best practices for developers.

Chrome DevTools ProtocolDebugging toolsHybrid Applications
0 likes · 14 min read
Evolution and Best Practices of Remote Debugging for Mobile and Hybrid Web Applications
Soul Technical Team
Soul Technical Team
Nov 9, 2022 · Frontend Development

Building a Hybrid App Debugging Tool with Electron and Chrome DevTools Protocol

Soul developed an Electron‑based hybrid app debugging tool that simulates H5 environments, bridges client‑side methods via CDP, and enables Chrome DevTools debugging of DOM, network, and touch events in webviews for effective troubleshooting.

CDPChrome DevTools ProtocolElectron
0 likes · 11 min read
Building a Hybrid App Debugging Tool with Electron and Chrome DevTools Protocol
ByteFE
ByteFE
Jan 17, 2022 · Frontend Development

Design and Implementation of CSS Visual Editing in the AUX Tool

This article explains how the internally developed AUX visual development tool extracts original CSS source metadata from the browser using native APIs, stylesheet inspection, and the Chrome DevTools Protocol, and how it processes that data to provide accurate, editable CSS code within a low‑invasion, code‑centric workflow.

AUXCSSChrome DevTools Protocol
0 likes · 14 min read
Design and Implementation of CSS Visual Editing in the AUX Tool
Beike Product & Technology
Beike Product & Technology
Oct 12, 2018 · Fundamentals

Headless Browser Automation: Selenium vs Puppeteer

This article explores headless browser automation technologies including Selenium, PhantomJS, Puppeteer, and Headless Chrome, comparing their architectures, use cases, and implementation differences.

Chrome DevTools ProtocolPhantomJSPuppeteer
0 likes · 9 min read
Headless Browser Automation: Selenium vs Puppeteer
Baidu Intelligent Testing
Baidu Intelligent Testing
Sep 25, 2017 · Mobile Development

Automated Measurement of Mobile H5 Page Load Time Using Chrome DevTools Protocol and Machine Vision

This article presents two experimental methods for automatically obtaining load‑time metrics of mobile H5 pages—one leveraging Chrome DevTools Protocol to collect network, page, DOM and runtime data from Android Chrome/WebView, and another using computer‑vision techniques to detect progress‑bar visual cues in recorded screen videos.

AndroidChrome DevTools ProtocolMachine Vision
0 likes · 9 min read
Automated Measurement of Mobile H5 Page Load Time Using Chrome DevTools Protocol and Machine Vision
Qunar Tech Salon
Qunar Tech Salon
Jul 19, 2017 · Frontend Development

Headless Chrome Automation: API Overview, Coding Tips, and Example Scripts

This article introduces the Chrome DevTools Protocol API, provides practical coding tips for using the chrome-remote-interface library, and demonstrates complete Node.js examples for gathering performance metrics, automating Baidu searches, and extracting first‑page results with headless Chrome.

Chrome DevTools ProtocolJavaScriptNode.js
0 likes · 9 min read
Headless Chrome Automation: API Overview, Coding Tips, and Example Scripts
Qunar Tech Salon
Qunar Tech Salon
Jul 17, 2017 · Frontend Development

Running and Controlling Headless Chrome via Command Line and Programmatic Interfaces

This article explains how to install Chrome, configure command‑line aliases, launch Headless Chrome with various flags, and interact with it both through direct CLI commands and programmatic Node.js libraries such as chrome‑launcher and chrome‑remote‑interface.

Chrome AutomationChrome DevTools ProtocolNode.js
0 likes · 8 min read
Running and Controlling Headless Chrome via Command Line and Programmatic Interfaces