【译】你不知道的 Chrome 调试工具技巧第二十二天：network

特别声明

本文是做者 Tomek Sułkowski 发布在 medium 上的一个系列。据做者透露一共有 24 篇，一直更新到 12 月 24 日
版权归原做者全部。
vue

做者在 Twitter 上推荐咱们的中文翻译啦,截图在最后
ios

译者在翻译前已经和做者沟通获得了翻译整个系列的受权。
为了避免影响你们阅读，受权的记录在这里
git

正文

在立刻就要迎来假期的这 24 天里，我将会发布一系列短篇的文章，关于如何更加有意思的使用开发工具，昨天咱们把玩了一下代码块，今天聊聊 Network ：github

61. Hide network overview（隐藏 network overview ）

你是否常常查看 Network 面板:正则表达式

看看请求的时间轴
或者，可能仅仅只是查看请求列表- 来确认状态，大小和响应呢?

我赌你是后者，若是是这样的话，那么 Overview 部分中没有任何理由能够占用 Network 一半左右的空间。隐藏它。异步

62.Request initiator shows a call stack( Request initiator 显示了调用堆栈信息)

译者注：initiator 能够翻译为启动器，可是太过生硬，你们理解意思就好。编辑器

Network 面板中的 initiator 列显示了是哪一个脚本的哪一行触发了请求。他显示了在调用堆栈中触发请求的最后一步，除非你用的是，例如：一个本地化的 fetch API,它将会指向一些低层级的类库的代码 - 例如当咱们在 Angular 配合使用 Axios 或者 zone.js 的时候，这时指向的是 xhr.jside

除了这些外部库以外，你可能但愿查看代码的哪一部分触发了请求。要将信息悬停在显示的 initiator（例如外部库）上，你将看到完整的调用堆栈，包括你的文件：工具