JS-使用AOP思想实现统计函数时间

平时在做开发的时候,有的时候会看到介绍说这个方法没有那个方法效率性能高,那么到底怎么高呢,大多数只是猜猜或者看书上介绍的原理而已。但是我们如何做到定量统计某个函数或者方法的性能呢。

例如往页面中插入大量dom元素的时候,我们一般会用createElement然后再append,然后如果你查资料你会看到建议你使用createDocumentFragment, 因为这个是先见元素插入到内存你中,然后再一次性插入到dom中,避免了频繁重绘。按道理来说确实是这样,那我们怎么亲自见证一下呢。

所以有个方法就是统计函数的执行时间,例如

最后可以得到函数的输出的时间,但是这种方法有个缺点就是侵入性太大了,用起来也不是太方便。总不能每个函数都要这样吧。

所以来正题了,使用aop的思想,aop又叫切面函数 Aspect-oriented programming  从侧面函数侧面出发,不去侵入函数内部,来做一些相应的统计或者非核心逻辑的功能。

参考这篇文章,做了一些修改,封装了before和after函数,来做统计不说那么多废话,show code.

代码比较简单,不做太多的解读。可以看到,这样之后,只要我们需要统计函数执行时间的时候,只需要额外的执行这个函数便是,也不需对原函数进行多余的改变。方便快捷。

只是有一个需要注意的地方就是Aop类来去扩展Function原生类,但是Fuction大家应该都知道,这家伙有点类似与eval函数,是个魔鬼,用的时候要适量和适宜。但是存在就有存在的道理,小心使用就好了。主要是我也没找到很合适的方法。

上面全是代码最后再加个菜。统计静态文件(js)的加载时间。

就这么多。demo 运行结果看console

参考:

Hello, what’s your name?

hello

发现自己是个逗比怎么办

发表评论

电子邮件地址不会被公开。 必填项已用*标注

This site uses Akismet to reduce spam. Learn how your comment data is processed.