ActionScript 3 和 Flex框架的性能优化
2011-03-04 11:11
309 查看
转载自 xukunwzq
最终编辑 xukunwzq
与其在程序写完了之后臃肿得跑不动,不如平时注意这些关键点,时时提醒自己。翻译出来,以便以后时时查阅。 1 创建新数组时避免使用它的构造函数。 这样做:var a = []; 而不要这样做:var a = new Array(); 2 创建数组是一个消耗量很大的操作,所以请谨慎进行以下类型的操作: var vanityCollection01 : Array = new Array(); var vanityCollection02 : Array = new Array(); var vanityCollection03 : Array = new Array(); var vanityCollection04 : Array = new Array(); 3 复制一个数组最快的方式是: var copy : Array = sourceArray.concat(); 4 无论你用哪种方式,为数组的元素设置值都是一个慢的操作。 employees.push( employee ); employees[2] = employee; 5 在数组中获得一个值的速度是设置一个值的二倍。 var employee : Employee = employees[2]; 6 将属性函数设置为静态函数,这样你在使用它的时候就不用实例化一个该类的对象。 StringUtils.trim( “text with space at end ” ); 类定义: package { public final class StringUtils { public static function trim( s : String ) : String { var trimmed : String; // 逻辑实现代码 return trimmed; } } } 7 使用常量关键字const来定义那些在程序运行周期内都不会发生值改变的属性。 public const APPLICATION_PUBLISHER : String = “Company, Inc.”; 8 当一个类不再需要有子类的时候,将它定义为final类。 public final class StringUtils 9 巨长的函数名和变量名在Action Script 3中不会造成任何额外的消耗,(在其他语言中也是) someCrazyLongMethodNameDoesntReallyImpactPerformanceTooMuch(); 10 在单行内定义多个变量不会带来任何性能的提升(在其他语言中也是) var i=0; j=10; k=200; 11 使用if和使用switch做逻辑判断所消耗的内存是没有区别的,例如: if ( condition ) { // 处理条件下的逻辑 } 跟使用switch switch ( condition ) { case “A”: // A条件下的处理逻辑 break; case “B”: // B条件下的处理逻辑 break; } 没有任何内存消耗上的区别。 12 使用if做逻辑判断时,尽可能的按照最有可能发生的情况的顺序来顺序排列。例如: if ( 最有可能发生的情况 ) { // 处理最有可能发生的情况。 } else if ( 有时候会发生的情况 ) { // 处理有时候会发生的情况。 } else { // 处理以上判断都没有发生时的情况 。 } 13 AVM在循环体内部进行计算时,将整型int数据提升为浮点型Number进行处理,(从fp9到fp10,虚拟机已经有所改变,int,uint,number之间的转换不再像之前那么慢了。) 14 注意解决类型转换,未知类型(unknown),非法类型(incorrect)的问题。 15 慎重使用 uint ,它会使程序变慢。 var footerHex : uint = 0×00ccff; 16 在迭代器中使用整型作为增长量 应该这样使用: for(var i: int = 0; i < n; i++) 而不是: for (var i: Number = 0; i < n; i++) 17 不要为int型变量赋小数值。 应该这样用: var decimal : Number = 14.654; 不应该: var decimal : int = 14.654; 18 乘法 vs 除法:使用 5000*0.001 来替代 5000/1000。 19 如果你要在for或者while循环体内频繁的使用一个值,请使用一个本地变量来存放它,而不是去频繁的计算它。 与其这样频繁的计算它: for (..){ a * 180 / Math.PI; } 不如定义一个变量来存放它: var toRadians:Number = a*180/Math.PI; 20 避免在循环体判断条件中进行计算,例如: var len : int = myArray.lengh; for (var i=0;i<len;i++){} 而不要这样做: for (var i=0;i< myArray.lengh;i++){ } (靠!我一直都这么干的!) 21 使用正则表达式来进行字符串检查,并使用字符串函数来进行字符串搜索。 例如:使用正则表达式做邮政编码检验 private var regEx:RegExp = /^[A-Z][0-9][A-Z] [0-9][A-Z][0-9]$/i; private function validatePostal( event : Event ) : void { if( regEx.test( zipTextInput.text ) ) { // 处理输入格式满足的情况 } } 使用字符串函数处理字符串查询: var string : String = “Search me”; var searchIndex : int = string.indexOf( “me” ); var search : String = string.substring( searchIndex, searchIndex + 2 ); 22 尽量重复使用那些属于“内存高消耗区”的对象,例如,DisplayObjects,URLLoader。 23 借鉴Flex对象的设计模式: createChildren(); commitProperties(); updateDisplayList(); 24 把使用Datagrids组件作为你最后的显示手段(如果你确信你真的没有办法使用一个常规的list实现你想要的功能,才使用它) 25 避免使用迭代器迭代具备滚动功能的数据。 26 避免使用setStyle()函数(这在Flex框架里是性能消耗量最大的行为之一) 27 使用过多的容器嵌套势必会降低你程序的性能。例如下面这个恶心的嵌套。 <mx:Panel> <mx:VBox> <mx:HBox> <mx:Label text=”Label 1″ /> <mx:VBox> <mx:Label text=”Label 2″ /> </mx:VBox> <mx:HBox> <mx:Label text=”Label 3″ /> <mx:VBox> <mx:Label text=”Label 4″ /> </mx:VBox> </mx:HBox> </mx:HBox> </mx:VBox> </mx:Panel> 28 你不用为每个容器都加上命名空间的标签,只有顶级容器需要这样做。下面这个就是不必要的。 <mx:Image xmlns:mx=”http://www.adobe.com/2006/mxml” source=”avatar.jpg” width=”200″ height=”200″ /> 29 移除不必要的容器来减少容器嵌套。 30 避免在标签内嵌套VBox容器(消除冗余) <mx:Panel> <mx:Label text=”Label 1″ /> <mx:Label text=”Label 2″ /> </mx:Panel> <mx:Panel> <mx:VBox> <mx:Label text=”Label 1″ /> <mx:Label text=”Label 2″ /> </mx:VBox> </mx:Panel> 31 在mx:Application 标签内部尽量避免使用VBox标签。(消除冗余) <?xml version=”1.0″ encoding=”utf-8″?> <mx:Application xmlns:mx=http://www.adobe.com/2006/mxml> <mx:Label text=”Label 1″ /> <mx:Label text=”Label 2″ /> </mx:Application> 而不要: <?xml version=”1.0″ encoding=”utf-8″?> <mx:Application xmlns:mx=http://www.adobe.com/2006/mxml> <mx:VBox> <mx:Label text=”Label 1″ /> <mx:Label text=”Label 2″ /> </mx:VBox> </mx:Application> 32 设置Repeater的recycleChildren属性为true可以提升它的性能(使用之前创建过的对象,而不是创建一个新对象) <mx:Script> <![CDATA[ [Bindable] public var repeaterData : Array = ["data 1", "data 2"]; ]]> </mx:Script> <mx:Repeater id=”repeater” dataProvider=”{repeaterData}” recycleChildren=”true”> <mx:Label text=”data item: {repeater.currentItem}”/> </mx:Repeater> 33 将帧频(framerate)设置为60或者更低。 <?xml version=”1.0″ encoding=”utf-8″?> <mx:Application xmlns:mx=http://www.adobe.com/2006/mxml frameRate=”45″> </mx:Application> 34 避免在每一帧内处理多个显示对象。 35 使用ENTER_FRAME 事件取代Timer事件 使用: public function onEnterFrame( event : Event ) : void { } private function init() : void { addEventListener( Event.ENTER_FRAME, onEnterFrame ); } 而不要使用: public function onTimerTick( event : Event ) : void { } private function init() : void { var timer : Timer = new Timer(); timer.start(); timer.addEventListener( TimerEvent.TIMER, onTimerTick ); } 36 在多帧中使用显示对象时,使用以下方法推迟它的对象创建: <mx:Container creationPolicy=”queued”/> 37 alpha = 0 并不等同于 visible = false(对象在不可见时将会不会被处理) 所以,使用: loginButton.visible = false; 而不是: loginButton.alpha = 0; 随着Flex越来越多的被人们所熟知,越来越多的互联网也开始了RIA应用。众所周知,目前国内的宽带应用并不是像很多发达国家发达,个人应用带宽基本上都是2M以下的,怎么样能够使你的Flex应用能够流畅的运行在客户端的问题,成为了制约每个Flex应用开发程序员的大难题。 在这里,我收集整理了一下网络上关于这方面经验,欢迎大家补充。 [b]基本原则: 1. 从外部加载媒体(Media) Heider提到了一个常用的Flex最佳实践——限制嵌入到应用/SWF文件中的媒体的数量,如图像、影片及mp3等资源都可以从外部的SWF文件加载。 Flex框架可以直接将图片、mp3及字体等资源编译到SWF中。当你想让最终用户获得全部资源时,这种方式确实能派上用场,但是这会导致你的应用长时间停留在“Loading”阶段。 2. 在嵌入式字体中限制字符集 Heider建议在嵌入式字体中限制字符集以降低SWF文件的总下载时间: 当你在Flex中嵌入一种字体时,你就会获得该字体的全部字符的支持。尽管这可能是你想要的,但你确信你需要全部字符么?例如,在一个只面向英文的应用中,你确信你真的想花时间下载中文字符数据么? 3. 缓存框架 Heider回顾了Flex 3 support for runtime-shared-libraries (RSL)这篇文章: 从Flex 3开始,你可以将Adobe签名的框架——RSLs缓存到Flash Player的cache中。这有两个好处。首先,缓存在Flash Player cache中的签名的框架RSLs可由所有配置好的Flex应用共享。换句话说,如果某人的应用已经下载了500k的签名的框架RSL,并且该RSL仍旧 在Flash Player cache中,那么你的应用就可以使用缓存下来的RSL。其次,即使某人清空了其浏览器缓存,对Flash Player cache也没有任何影响。 4. 考虑模块化 Heider谈到了将Flex应用划分成模块的好处:减少字体加载时间的另一种方式就是将你的Flex应用划分成模块。使用模块的一个好处在于当加载和卸载模块时你能完全操控它。 之所以要划分成模块的最后一个原因是他们更快,而且我能即时加载它们。换句话说,在启动时唯一需要加载的模块就是 Step1.swf模块。因此,在使用模块的情况下,最终用户节省了启动时间,但是当他从一个模块切换到另一个模块时却需要花更多时间,因为每个模块都需 要以JIT形式加载。在我的应用中,只有当用户首次在steps 1-5之间切换时需要花更多时间。 5. 推迟实例化 Heider围绕着Flex组件的“creationPolicy”属性及何时实例化应用的不同部分给出了很多建议。 如果你想减少从数据下载到用户真正可以使用的总时间,当务之急就是推迟实例化。这项技术背后的理念就是直到应用真正使用的时候才在内存中创建对象。 尽管推迟实例化技术会在应用的整个使用过程中导致少许——通常不那么明显——的延迟,但与长时间的启动延迟相比,它还是可接受的。推迟实例化的另一个好处在于内存使用的优化。 以上原则来自Jun Heider在O’Reilly的InsideRIA站点上发表了一篇精彩的文章,该文章就如何加快Flex应用的启动速度提出了很多建议,以帮助用户减少看见讨厌的“Loading”对话框的出现时间。他深入探讨了问题的不同方面,并对每种技术的优势和劣势进行了评判。Heider还谈到了一个“实验性”的条款——“使用流”,这是他在讨论Dirk Eismann的帖子(Building monolithic Flex SWFs that still startup quickly.”)时谈及的。Eismann提出一项技术以利用Flash Player中的多个frames以在部分应用中达到流的目的。查看所有的帖子以更多地了解该技术及关于加快Flex启动速度的建议。 内存释放优化原则 1. 被删除对象在外部的所有引用一定要被删除干净才能被系统当成垃圾回收处理掉; 2. 父对象内部的子对象被外部其他对象引用了,会导致此子对象不会被删除,子对象不会被删除又会导致了父对象不会被删除; 3. 如果一个对象中引用了外部对象,当自己被删除或者不需要使用此引用对象时,一定要记得把此对象的引用设置为null; 4. 本对象删除不了的原因不一定是自己被引用了,也有可能是自己的孩子被外部引用了,孩子删不掉导致父亲也删不掉; 5. 除了引用需要删除外,系统组件或者全局工具、管理类如果提供了卸载方法的就一定要调用删除内部对象,否则有可能会造成内存泄露和性能损失; 6. 父对象立刻被删除了不代表子对象就会被删除或立刻被删除,可能会在后期被系统自动删除或第二次移除操作时被删除; 7. 如果父对象remove了子对象后没有清除对子对象的引用,子对象一样是不能被删除的,父对象也不能被删除; 8. 注册的事件如果没有被移除不影响自定义的强行回收机制,但有可能会影响正常的回收机制,所以最好是做到注册的事件监听器都要记得移除干净。 9. 父对象被删除了不代表其余子对象都删除了,找到一种状态的泄露代码不等于其他状态就没有泄露了,要各模块各状态逐个进行测试分析,直到测试任何状态下都能删除整个对象为止。 内存泄露举例: 1. 引用泄露:对子对象的引用,外部对本对象或子对象的引用都需要置null; 2. 系统类泄露:使用了系统类而忘记做删除操作了,如BindingUtils.bindSetter(),ChangeWatcher.watch()函数 时候完毕后需要调用ChangeWatcher.unwatch()函数来清除引用 ,否则使用此函数的对象将不会被删除; 类似的还有MUSIC,VIDEO,IMAGE,TIMER,EVENT,BINDING等。 3. 效果泄露:当对组件应用效果Effect的时候,当本对象本删除时需要把本对象和子对象上的Effect动画停止掉,然后把Effect的target对象置 null; 如果不停止掉动画直接把 Effect置null将不能正常移除对象。 4. SWF泄露:要完全删除一个SWF要调用它的unload()方法并且把对象置null; 5. 图片泄露:当Image对象使用完毕后要把source置null;(为测试); 6. 声音、视频泄露: 当不需要一个音乐或视频是需要停止音乐,删除对象,引用置null; 内存泄露解决方法: 1. 在组件的REMOVED_FROM_STAGE事件回掉中做垃圾处理操作(移除所有对外引用(不管是VO还是组件的都需要删除),删除监听器,调用系统类的清除方法) 先remove再置null, 确保被remove或者removeAll后的对象在外部的引用全部释放干净; 2. 利用Flex的性能优化工具Profile来对项目进程进行监控,可知道历史创建过哪些对象,目前有哪些对象没有被删除,创建的数量,占用的内存比例和用量,创建过程等信息; 总结:关键还是要做好清除工作,自己设置的引用自己要记得删除,自己用过的系统类要记得做好回收处理工作。 以上问题解决的好的话不需要自定义强制回收器也有可能被系统正常的自动回收掉。 |
相关文章推荐
- ActionScript 3 和 Flex框架的性能优化
- ActionScript 3 和 Flex框架的性能优化
- 【转】 ActionScript 3 和 Flex框架的性能优化
- ActionScript 3 和 Flex框架的性能优化
- flex外包团队—北京动点软件:谈谈flex性能优化
- 关于angularJS 框架优化(按需加载),性能提升问题(grunt)。
- Regmap 框架:简化慢速IO接口优化性能【转】
- Dojo javascript 框架控件性能优化最佳实践
- Flex性能优化常用手法总结 转
- laravel 5.1 性能优化对比 - 框架提供的方法
- 转:前端工程与性能优化(下):静态资源管理与模板框架
- flex 性能优化(2) : Dictionary class
- JS性能优化框架
- flex 性能优化
- Flex应用程序的性能优化
- android 网络框架性能优化分析
- Flex性能优化常用手法总结
- Flex 编程注意之性能优化、垃圾回收的一些总结
- flex 性能优化
- Starling 框架性能优化方案