Debug的那些事儿

我们写代码的多多少少有一些出错的几率，掌握Debug还是很重要的，记得第一次入行写企业系统时，对此一无所知，后来还是去网路上以及问前辈，我印象中还是在博客园里看到有人用firebug，才知道原来有firefox这样的浏览器，那是在2010年的夏天。

第一次接触firebug就爱不释手，比之IE的开发者工具，不知道“牛逼”了多少。简直是前端开发的福音，造福一方。它的存在不知道提高了多少倍开发效率，可惜的是，这样的产品，我个人也是一直用到了2012年。后来出现了Chrome然后就转换到了Chrome dev tool上，产品就是这样，更新迭代一直到退出历史舞台。

Firebug已经停止更新，退出历史舞台了。

我们的企业系统主要兼容IE，是为国家电网做的财务审批系统。不客气的说，为了兼容IE，费了我们很大的精力，处理诸 * 号之类的特殊样式，在脚本上会处理像window.event这样的event对象，有意思的是，我们依然很少会打开IE的开发者调试工具，只有到了“山穷水尽”的时候，一直使用Firebug。

说实话，调试这门手艺活儿，时至今日的演变，我又很少使用Chrome dev tool了，而是用VS code自带的debug来调试，在编辑器中完成几乎80%以上的工作。

个人的缩影倒是像极了前端发展的历程，可以说Debug见证了这样的路。到了今天Debug工具已经可以支持起不同平台领域的调试，Chrome dev tool的强大已经到了让我们感叹的时候。如果你开发Node.js程序，纯粹的Chrome dev tool虽然不是首选，但不得不说Node.js的发展初期，Chrome dev tool给了Node.js调试的能力，而现在我可能更愿意用IDE里提供的debug环境。像我们如果要调试真机里的Hybrid程序，Chrome提高了USB连接调试的选项，而Safari一直都有，不过我常用到的是在模拟器+Safari的调试能力。后来，出现的React Native，Weex，Chrome依然占据了调试能力的风口。

说这么多，眼下Chrome dev tool用好，对于提高开发效率，捕获性能，是最佳的帮手，看见没有，IE的调试工具，依然很少打开。这，你感谢的不是Chrome dev tool而是Web开发标准。这几年浏览器厂商，越来越愿意根据标准来实现具体的API或内容，为了更好的以后，我相信，我们最终需要的可能就是用好一款调试工具即可。

标准的普及，也为调试带来极大的便捷，不需要像7-8年前那样，需要你去处理各个不同，特别是样式部分，这个蛋疼的问题，只会越来越好，而不是更差。

为了用好，推荐大家有时间时，阅读：

https://developers.google.com/web/tools/chrome-devtools/?hl=zh-cn

https://developer.chrome.com/devtools

这个工具可以带来的会是更多的东西，想想Node.js，想想Weex，你就会发现确实的牛逼