webkit / chrome的WebInspector资源检查如何工作？

Question

我一直想知道resource inspection如何在webkit / safari / chrome的WebInspector中工作。

浏览器必须提供本机BPI或javascript以显示查询列表及其时间轴，二进制API的名称是什么？我可以使用相同的API编写Chromium扩展吗？

Answer 1

资源请求和其他DevTools / WebInspector相关数据由InspectorController及其代理收集。 （它只是C ++代码）

之后，所有数据都作为Web调用WebInspector对象的方法进入WebInspector。

您可能知道所有DevTools / WebInspector的GUI都是一个html页面和许多JavaScript。

您可以尝试通过Inspector本身调查Inspector的内部世界。

1. 以旗帜启动Chrome --process每片;
2. 以未停靠模式打开Inspector窗口;
3. 在巡视窗口中按Ctrl-Shift-I。

Inspector和被检查页面之间的所有流量都通过两个函数传递： 从Inspector到检查页面 - sendMessageToBackend 从检查页面到检查员 - devtools$$dispatch

您可以通过此link跟踪WebKit中WebInspector的最新更改。