[feat] 按照protocol monitor的样式来设计，简直是量身定做

[tyn1998]

method在sendRequest/sendNotification/onRequest/onNotification都能拿到，要解决的问题是sendRequest和requestResult怎么对应起来。

[tyn1998]

还有消息的size，这个size先直接算parse后的字符串的size，具体发送的时候怎么压缩的不去管。

[tyn1998]

要解决的问题是sendRequest和requestResult怎么对应起来。

已搞定：

[tyn1998]

• onRequest如果method不存在会return一个{data: NOTREGISTERMETHOD}
• requestResult也有result.error的情况

这两种情况在呈现的时候可以考虑单元格背景会红色表示出错（或其他方式）

[tyn1998]

找到了protocol monitor的源码：https://github.com/ChromeDevTools/devtools-frontend/blob/main/front_end/panels/protocol_monitor/ProtocolMonitor.ts

但是，这是属于devtools-fronted的一部分，看上去直接抄是不大有戏的。

[tyn1998]

JSON parse view参考devtools-frontend：

https://github.com/ChromeDevTools/devtools-frontend/blob/main/front_end/ui/legacy/components/source_frame/JSONView.ts

[tyn1998]

如果不搞JSON view，则横向可能会有滚动条，这个时候要加冻结表格列功能（参考antd）。

[tyn1998]

把devtools-frontend的代码改写成react实在不是个简单的事情，于是相中了react-data-grid组件：支持调整宽度和冻结。