【译】你不知道的 Chrome 调试工具技巧 第九天：给 console 计时

特别声明

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

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

文末有做者的最新动态哦~

正文

在立刻就要迎来假期的这 24 天里，我将会发布一系列短篇的文章，关于如何更加有意思的使用开发工具，昨天 咱们和多才多艺的 color picker(颜色选择器) 快乐的玩耍了 ，今天咱们有两则与时间有关的小 tips ：

26. 给 logs 加上时间戳

若是想要给你的应用中发生的事件加上一个确切的时间记录，开启 timestamps 。你能够在设置(在调试工具中的 ⋮ 下拉中找到它，或者按下 F1 )中来开启或者使用 Commands Menu

27.监测执行时间

相比在全部事件上展现一个时间戳，你或许对脚本中特殊的点之间的时间跨度更加感兴趣

对于这样的状况，咱们能够采用一对有效的 console 方法

• console.time() — 开启一个计时器
• console.timeEnd() — 结束计时而且将结果在 console 中打印出来

若是想一次记录多件事，能够往这些函数中传入不一样的标签值。(例如:console.time('loading'), console.timeEnd('loading'))

惯例： 若是你从这里学到了一些新东西

→ 你能够点个赞再走嘛~
→ 关注我：Twitter：Tomek Sułkowski

其余系列

其余此系列的文章，立刻就会翻译出来，到时会贴出对应的连接在此处。

• 【译】你不知道的 Chrome 调试工具技巧 第一天：console 中的'$'
• 【译】你不知道的 Chrome 调试工具技巧 次日：copying & saving
• 【译】你不知道的 Chrome 调试工具技巧 第三天：console methods
• 【译】你不知道的 Chrome 调试工具技巧 第四天：the Elements panel（元素面板）
• 【译】你不知道的 Chrome 调试工具技巧 第五天：console 的 log 中,让人疑惑的案例
• 【译】你不知道的 Chrome 调试工具技巧 第六天：command 菜单
• 【译】你不知道的 Chrome 调试工具技巧 第七天：异步 consle 的趣味小窍门
• 【译】你不知道的 Chrome 调试工具技巧 第八天：Color picker（颜色选择器）
• 【译】你不知道的 Chrome 调试工具技巧 第九天：给 console 计时
• 【译】你不知道的 Chrome 调试工具技巧 第十天：custom formatters（自定义格式转换器）
• 【译】你不知道的 Chrome 调试工具技巧 第十一天：style editors continued（样式编辑器后续）
• 【译】你不知道的 Chrome 调试工具技巧 第十二天：忍者日志打印！(the ninja logs)
• 【译】你不知道的 Chrome 调试工具技巧 第十三天：对象 & 方法
• 【译】你不知道的 Chrome 调试工具技巧 第十四天：其余快捷键~
• 【译】你不知道的 Chrome 调试工具技巧 第十五天：Twitter day~
• 【译】你不知道的 Chrome 调试工具技巧 第十六天：断点
• 【译】你不知道的 Chrome 调试工具技巧 第十七天：再会 console
• 【译】你不知道的 Chrome 调试工具技巧 第十八天：Drawer 里的秘密
• 【译】你不知道的 Chrome 调试工具技巧 第十九天：深刻 Drawer
• 【译】你不知道的 Chrome 调试工具技巧 第二十天：Workspace的黑魔法
• 【译】你不知道的 Chrome 调试工具技巧 第二十一天：Snippets(代码块)
• 【译】你不知道的 Chrome 调试工具技巧 第二十二天：network
• 【译】你不知道的 Chrome 调试工具技巧 第二十三天：Drawer tips 后续
• 【译】你不知道的 Chrome 调试工具技巧 第二十四天：最后一天，元旦牛逼

写在最后

若是你对个人翻译表示确定，也能够关注我一波哦~ 顺便个人开源项目，求一波 star→ 看这里, 美丽的博客系统

做者在Twitter上推荐咱们的中文翻译啦