起因
要捕获 JavaScript 代码中的异常一般会采用 try catch,不过 try catch 的使用是否是对代码性能产生影响呢?答案是肯定有的,但是有多少不得而知。
淘宝前端线上脚本错误的捕获方法:
1 2 3 4 5 6 7 |
window.JSTracker = window.JSTracker || []; try{ //your code }catch(e){ JSTracker.push(e); throw e; //建议将错误再次抛出,避免测试无法发现异常 } |
设计实验方式
简单的设计方案也就是对比实验。
空白组1:[无 try catch 的情况下对数据取模1千万次耗时]
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
<!DOCTYPE html> <html> <head> <title>1 无try catch的情况耗时</title> <script> !function() { //无try catch的情况耗时 var t = new Date(); //耗时代码开始 for (var i = 0; i < 100000000; i++) { var p = i % 2; } //耗时代码结束 document.write(new Date() - t); }(); </script> </head> <body> </body> </html> |
参照组2:[将耗时代码用 try 包围,内联耗时代码]
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 |
<!DOCTYPE html> <html> <head> <title>2 在 try 中内联代码的耗时情况</title> <script> !function() { //在 try 中内联代码的耗时情况 var t = new Date(); try{ //耗时代码开始 for (var i = 0; i < 100000000; i++) { var p = i % 2; } //耗时代码结束 throw new Error(); }catch(e){ } document.write(new Date() - t); }(); </script> </head> <body> </body> </html> |
参照组3:[将耗时代码用 try 包围,外联耗时代码]
1 2 3 4 5 6 7 8 9 10 11 12 13 ¯定有的,但是有多少不得而知。
淘宝前端线上脚本错误的捕获方法:
设计实验方式简单的设计方案也就是对比实验。 空白组1:[无 try catch 的情况下对数据取模1千万次耗时]
参照组2:[将耗时代码用 try 包围,内联耗时代码]
参照组3:[将耗时代码用 try 包围,外联耗时代码]
|