前言
chrome中devtools大家应该很熟悉，里面有着很多的面板，像elemnts，console以及network等等。这些面板在我们的开发中占着举足轻重的作用。
但是在chrome中其实还有一个隐藏的devtools，可能你不是很熟悉。它里面也有一些面板，可能你暂时用不上，但是有些时候，他却能提高你的工作效率。下面就让我们来一探究竟。
drawer
在devtools界面，按下 [esc] 键即可打开 drawer，在按则会隐藏。
默认情况下，只显示一个console面板，他与devtools中的console面板完全完全一致。好处是，这样你就可以，一边看console中log信息，一边调试 接口或者在elements调试样式。
drawer中的面板
点击drawer 左侧的 ⋮ 图标，可打开所有面板列表，选择相应的选项，可以将其添加到drawer中。
当然，通过crtl + shift + p打开 command menu，输入drawer，选择相应的选项，也可以添加到drawer中。
下面是drawer中的所有选项，以供大家参考：
AnimationsChangesConsoleCoverageNetwork conditionsPerformance monitorQuick sourceRemote devicesRenderingRequest blockingSearchSensorsWhat’s new
Quick source
就像它的英文字面意思一样，当你在看console中的log信息时，想快速看看源代码或者断点时，可以打开它，其实也是蛮有用的。
changes
当你在elements中对dom样式就行修改时，所做的改动都会在changes面板中记录。
并且，可以点击最下面的撤回按钮，进行一键撤回。
