当前位置: 首页 > 后端技术 > Node.js

javaScript代码优化

时间:2023-04-03 10:40:06 Node.js

v8级varperson={multiply:function(a,b){returna*b;},name:'gcy'}for(leti=0;i<1000;i++){person.multiply(i,i);}定义对象时,最好在一开始就初始化对象的属性,而不是动态添加。在java或c++静态语言中,类信息是确定的,所以在编译阶段就确定了每个对象中有哪些成员和成员偏移量,基地址和偏移地址可以快速访问到对象的内部信息。js中的对象属性可以动态添加或删除。为了根据索引快速访问成员,V8内部生成了一个数据结构,叫做hiddenclass(基于运行对象的分类)。动态添加属性会导致隐藏类派生,v8优化(针对热点代码,v8会使用优化编译器,目前默认为CrankShaft,例如上例中,for循环中会进行参数预测,标记作为塑料)在代码之后。另外,建议在写代码的时候不要让程序进行类型推导。解决方案包括flow和typeScript。我用过flow,侵入性低,好用。建议使用它。这样做的目的是可以在大型项目协作的过程中使用。代码可维护性好,二来可以提高v8的执行效率,避免优化回滚(重新执行函数->ast->机器码流程)。c++级别voidMethod(constFunctionCallbackInfo&args){Isolate*isolate=args.GetIsolate();//隔离V8运行时args.GetReturnValue().Set(String::NewFromUtf8(isolate,"hwgcy"));}voidinit(Localexports){NODE_SET_METHOD(exports,"hw",Method);//导出方法}NODE_MODULE(addon,init)constbinding=require('./build/Release/binding');console.log(binding.hw());C++扩展节点模块(用于低级扩展和高效场景)为什么要用C++写节点?http://www.tuicool.com/articl...工具级别Prepack(js执行效率优化)webpack2(tree-shaking)体积优化内存级别varvm=newWeakMap();varb=newObject();vm.set(b,{'name':'gcy'});b=空;vm.get(b);使用weakMap,在key对应的对象可能消失的情况下,是降低内存泄露概率,合理利用内存的途径之一。参考链接weakmapdomlevel尽量减少dom访问次数,注意重绘重排,尽量在JavaScript端处理,‘离线操作DOM树’,使用缓存,减少访问布局信息的次数案例1不要频繁获取布局信息,因为会导致渲染队列刷新,比如常用的offsetTop属性,offsetWidth属性等。Case2批量修改dom时,让元素脱离文档流(!important),套用多重变化逻辑,再将元素放回文档中。脱离文档流的三种方式隐藏元素,应用修改,重新显示片段,创建一个额外的DOM复制树的原始元素,修改后,在替换动画元素,操作vnode,diff后在实际元素上应用最终逻辑,使用事件委托减少事件处理器的数量(本质上是使用冒泡机制,比较简单,不举例)js级案例1函数ProcessArray(items,process,callback){lettodo=items.concat();setTimeout(function(){process(todo.shift());//如果还有Process元素,再创建一个timerif(todo.length>0){setTimeout(arguments.callee,20);}else{callback(items);}},20)}上面优化的目的是为了避免浏览器Locking,也可以使用webworkvarworker=newWorker('process.js');worker.onmessage=function(event){//logic}worker.postMessage(items)//process.jself.onmessage=function(event){varans=process(event.data);self.postMessage(ans);}案例2varnum1=5;varnum2=6;eval("num1+num2");newFunction("arg1","arg2","re??turnarg1+arg2");setTimeout("sum1=num1+num2",100)避免双重评估Case3functionfact1(n){if(n==0)return1;退役瓮n*fact1(n-1);}------------------------------------fact2(n,acc=1){如果(n==0)返回acc;returnfact2(n-1,acc*n);}可见尾递归优化的目的是防止栈溢出。关于js的技巧还是蛮多的,比如Lazyloading、bitmanipulation、throttle等等,就不一一列举了。总结js优化这篇文章是工作总结的一小部分,大部分是看书后的理解和总结(高性能js和NODE进阶之路等),其实还是挺多的,而且我稍后会添加更多。