Awesome chrome-devtools
Awesome tooling and resources in the Chrome DevTools ecosystem
DevTools as an IDE
- Chrome DevTools App - Standalone devtools app which can inspect various targets.
- DevTools Remote - Remotely debug someone else's browser via Chrome DevTools.
Node.js + DevTools
- chrome-remote-interface - The recommended Node.js API for the protocol. There are also TypeScript-friendly alternatives.
- chrome-devtools-frontend - Mirror of the frontend shipping in Chrome.
- chrome-timeline-model - Uses frontend as lib to process profiling data.
- crmux - Multiplexes protocol connections.
- buggerJS - Provides Chrome DevTools bindings for node.
Chrome Debugging Protocol
- Debugging Protocol Viewer - Easy browsable UI for exploring the protocol's domains, methods and events
- Remote Debug Gateway - Allows you to connect a client to multiple browsers at once.
- Remote Debug Firefox adapter - Translates Firefox's devtools protocol to the CDP
- ios-webkit-debug-proxy - Exposes Mobile Safari & UIWebView instances via the CDP.
- devtools-compat-proxy - Young effort to translate modern Safari debugging protocol to modern CDP.
- crmux - Multiplexer to handle multiple clients.
- PonyDebugger - Remote network and data debugging iOS apps with Chrome DevTools
Network Inspection
- betwixt - System level network proxy, providing inspection via Network panel
CPU profile
- JSCLegacyProfiler/json2trace - Converts Safari's JavaScriptCore profiler output into
.cpuprofile
- call-trace - Can instrument your JS with hooks, and then generate a
.cpuprofile
of the of the complete (non-sampled) execution. View either time or call counts. - cpuprofilify - Converts output of various profiling/sampling tools to the
.cpuprofile
format. - Wishbone python framework - Profiling data can export as
.cpuprofile
.
Chrome Debugger integration with Editors
- Showcase Protocol Clients - Lists many, like Brackets, Vim, LightTable, Sublime, etc.
- VS Code - Debugger for Chrome - Chrome Debugger for Visual Studio Code
Extensions
Workflow
- Clockwork View PHP application profiling data.
- Emulated Device Lab - Experiment with multiple devices being emulated at the same time.
- RailsPanel - View Ruby on Rails application profiling data.
- React Developer Tools - Inspect the React component hierarchies.
UX
- DevTools Author - A selection of author settings for Chrome Developer Tools.