此文转载:
对于Flex性能我想是很多真正打算用它的人最关心的问题,也是我用了这么久之后体会比较深刻的问题,
目前我做过的系统性能也是一个大问题,在这里我总结了一些在技术上提高性能的方法。
1.避免容器的深层嵌套(因为每个容器都会对其子容器进行计算和调整,一般建议HBox,VBox最好不要超过3层,但对于复杂系统这个很难避免)
2.对于容器和空间的位置和尺寸尽量采用绝对坐标和硬编码。(减少Flash Player深层次的嵌套计算)
3.合理恰当的使用Grid容器,对于能用普通容器如HBox,VBox实现的尽量不要采用Grid(Grid嵌套层次深)
4.避免使用重复、冗余的容器嵌套,如:
1) 在Panel,Application中添加一层VBox,Panel,Application本来就是继承于VBox的,添加无谓的VBox只能降低你系统的性能。
2) 对于自定义的容器减少重复多余的父容器,比如:
<mx:VBox backgroundColor=" #FFCCCC" borderStyle=" solid">
<myComponent xmlns=" *" />
</mx:VBox>
你完全可以采用下面的写法,对于myComponents可能它本身就是VBox
<myComponent xmlns=" *" backgroundColor=" #FFCCCC" borderStyle="solid" />
5.延迟实例化导航类容器(Deferred Instantiation Navigator Containers)
如ViewStack, Accordion, TabNavigator等,本身就提供了延迟实例化的功能,你只需要修改其creationPolicy='auto'即可,它将只实例化第一个要显示的子控件,其余的将在需要的时候实例化。
6.对于flex的效果(Effects)要做到尽量平滑(Smoothly),比如延长它的持续时间(duration),避免使用bmp格式的图片作背景。
7.对于DataGrid的复杂ItemRenderer,尽量用Canvas而不是VBox or HBox,这个和Flex 1.5中是不同的。
8.如果DataGrid的ItemRenderer是ComboBox等,尽量用ItemEditor而不是ItemRenderer,只有当选中的cell才会显示其Renderer(避免一次性把所有的cell Renderer都画出来)
9.记得随时Remove 没有用的Listener或采用弱引用,这个我在事件机制中提到过(URL...); null不用的变量和数组。
10.对于大批量的数据采用需要的时候去取或者分页
11.提前声明频繁使用的变量,如:
var l:int=list.length;
var w:int = stage.stageWidth;
for(var i : int=0; i < l; i++){
list[i].x = w -100;
}
12.这样也能提高Flex的性能,可能很多人都会不屑,但至少对于Flex来讲它能减少不必要的计算,改善性能,我想这个编程习惯问题要改还真是不容易,至少我写了1年多直到最近才注意到这个问题。
另外和代码组织有关的建议,如:
1) 系统性的常量写在一个常量类里头并用const关键字,一些ItemRenderer代码尽量独立成一个文件而不是直接到处都写
2) 不要在界面元素中引用一大串的parent.parent.parent...,一旦界面重新组织将给你带来很大麻烦。如果你用Cairngorm框架,那么就应该用ViewHelper,尽量的松耦合你的代码。
13.修改 production-mode 属性为true,2.01在文件flex-webtier-config.xml中。它一般是产品发布的时候要设置的,你可以理解为c++的 Release和Debug版本之间的差异。
14.如果你用FDS,那么尽量用Remote Object 而不是Http Service or Web Service,因为前者的效率最高
15.对你的系统进行压力测试,Adobe有一个测试工具,叫Flex Stress Testing Framework
(rul:http://labs.adobe.com/wiki/index.php/Flex_Stress_Testing_Framework).
它能提供对RPC中的RTMP, AMF,HTTP测试,一般的商业测试软件不支持前两者的测试,
简单的理解Flex的工作原理
我通过简单的对比,让大家很快的了解它的工作原理。先回想一下jsp的工作原理,它首先被预编译成 servlet,也就是我们熟悉的java类,然后再编译成jvm所能执行的class字节码。而mxml文件的这个工作原理与jsp很相似的,mxml首先也被预编译成as中间文件,在编译成Adobe Flash Player 能执行的swf字节码。Adobe Flash Player 就像java虚拟机一样。但它们有一点不同的是,jsp的字节码执行是在服务器端执行的,而Flex的swf字节码是有服务器发送到客户端(浏览器)的Adobe Flash Player 上执行的。这一点的差别,大家可能就可以看出flex的优点了,起码可以减轻服务器的压力了。
更形象的我们可以把mxml比作jsp,而as看成servlet(java)来理解可能更简单了。上面是从工作原理上比喻是非常接近的。如果我们但从表现的比喻的话,可以把mxml看成是html,而把as看成javascript。这样大家可能会更好的理解,mxml(html)主要用来显示的,而as(javascript)主要用来控制一些编程逻辑和用户交互的需求。
如果你正在IE8下使用BlazeDS的HTTP Streaming功能,默认条件下,这个功能是不能正常工作的。这个Bug已经被记录在http://bugs.adobe.com/jira/browse/BLZ-378 中。
HTTP Streaming 是一种介于Socket连接和HTTP Poll之间的方式。其应用方面主要是及时应用需求较高的地方,比如聊天,在线多人互动游戏,白板。他同步数据的实时性介于Socket连接和Http poll。
对于Socket连接,他的优点在于防火墙穿透性非常好,由于其实现是使用HTTP线程,因此,如果给大型企业开发应用时,遇到比较严格的企业防火墙机制,HTTP Streaming是比Socket连接更好的选择。
而对于Http poll来说,由于HTTP Steaming采用一个HTTP线程监听,一个HTTP线程取数据,自然延迟要比HTTP Poll小很多,效率也要高出N多倍。
这里,Adobe 的Bug追踪系统给出了暂时在IE8下的解决方案:在服务器上,配置services-config.xml (一般在WEB-INF/flex/下)对max-streaming-clients 这个属性进行配置。
对于Flex性能我想是很多真正打算用它的人最关心的问题,也是我用了这么久之后体会比较深刻的问题,
目前我做过的系统性能也是一个大问题,在这里我总结了一些在技术上提高性能的方法。
1.避免容器的深层嵌套(因为每个容器都会对其子容器进行计算和调整,一般建议HBox,VBox最好不要超过3层,但对于复杂系统这个很难避免)
2.对于容器和空间的位置和尺寸尽量采用绝对坐标和硬编码。(减少Flash Player深层次的嵌套计算)
3.合理恰当的使用Grid容器,对于能用普通容器如HBox,VBox实现的尽量不要采用Grid(Grid嵌套层次深)
4.避免使用重复、冗余的容器嵌套,如:
1) 在Panel,Application中添加一层VBox,Panel,Application本来就是继承于VBox的,添加无谓的VBox只能降低你系统的性能。
2) 对于自定义的容器减少重复多余的父容器,比如:
<mx:VBox backgroundColor=" #FFCCCC" borderStyle=" solid">
<myComponent xmlns=" *" />
</mx:VBox>
你完全可以采用下面的写法,对于myComponents可能它本身就是VBox
<myComponent xmlns=" *" backgroundColor=" #FFCCCC" borderStyle="solid" />
5.延迟实例化导航类容器(Deferred Instantiation Navigator Containers)
如ViewStack, Accordion, TabNavigator等,本身就提供了延迟实例化的功能,你只需要修改其creationPolicy='auto'即可,它将只实例化第一个要显示的子控件,其余的将在需要的时候实例化。
6.对于flex的效果(Effects)要做到尽量平滑(Smoothly),比如延长它的持续时间(duration),避免使用bmp格式的图片作背景。
7.对于DataGrid的复杂ItemRenderer,尽量用Canvas而不是VBox or HBox,这个和Flex 1.5中是不同的。
8.如果DataGrid的ItemRenderer是ComboBox等,尽量用ItemEditor而不是ItemRenderer,只有当选中的cell才会显示其Renderer(避免一次性把所有的cell Renderer都画出来)
9.记得随时Remove 没有用的Listener或采用弱引用,这个我在事件机制中提到过(URL...); null不用的变量和数组。
10.对于大批量的数据采用需要的时候去取或者分页
11.提前声明频繁使用的变量,如:
var l:int=list.length;
var w:int = stage.stageWidth;
for(var i : int=0; i < l; i++){
list[i].x = w -100;
}
12.这样也能提高Flex的性能,可能很多人都会不屑,但至少对于Flex来讲它能减少不必要的计算,改善性能,我想这个编程习惯问题要改还真是不容易,至少我写了1年多直到最近才注意到这个问题。
另外和代码组织有关的建议,如:
1) 系统性的常量写在一个常量类里头并用const关键字,一些ItemRenderer代码尽量独立成一个文件而不是直接到处都写
2) 不要在界面元素中引用一大串的parent.parent.parent...,一旦界面重新组织将给你带来很大麻烦。如果你用Cairngorm框架,那么就应该用ViewHelper,尽量的松耦合你的代码。
13.修改 production-mode 属性为true,2.01在文件flex-webtier-config.xml中。它一般是产品发布的时候要设置的,你可以理解为c++的 Release和Debug版本之间的差异。
14.如果你用FDS,那么尽量用Remote Object 而不是Http Service or Web Service,因为前者的效率最高
15.对你的系统进行压力测试,Adobe有一个测试工具,叫Flex Stress Testing Framework
(rul:http://labs.adobe.com/wiki/index.php/Flex_Stress_Testing_Framework).
它能提供对RPC中的RTMP, AMF,HTTP测试,一般的商业测试软件不支持前两者的测试,
简单的理解Flex的工作原理
我通过简单的对比,让大家很快的了解它的工作原理。先回想一下jsp的工作原理,它首先被预编译成 servlet,也就是我们熟悉的java类,然后再编译成jvm所能执行的class字节码。而mxml文件的这个工作原理与jsp很相似的,mxml首先也被预编译成as中间文件,在编译成Adobe Flash Player 能执行的swf字节码。Adobe Flash Player 就像java虚拟机一样。但它们有一点不同的是,jsp的字节码执行是在服务器端执行的,而Flex的swf字节码是有服务器发送到客户端(浏览器)的Adobe Flash Player 上执行的。这一点的差别,大家可能就可以看出flex的优点了,起码可以减轻服务器的压力了。
更形象的我们可以把mxml比作jsp,而as看成servlet(java)来理解可能更简单了。上面是从工作原理上比喻是非常接近的。如果我们但从表现的比喻的话,可以把mxml看成是html,而把as看成javascript。这样大家可能会更好的理解,mxml(html)主要用来显示的,而as(javascript)主要用来控制一些编程逻辑和用户交互的需求。
如果你正在IE8下使用BlazeDS的HTTP Streaming功能,默认条件下,这个功能是不能正常工作的。这个Bug已经被记录在http://bugs.adobe.com/jira/browse/BLZ-378 中。
HTTP Streaming 是一种介于Socket连接和HTTP Poll之间的方式。其应用方面主要是及时应用需求较高的地方,比如聊天,在线多人互动游戏,白板。他同步数据的实时性介于Socket连接和Http poll。
对于Socket连接,他的优点在于防火墙穿透性非常好,由于其实现是使用HTTP线程,因此,如果给大型企业开发应用时,遇到比较严格的企业防火墙机制,HTTP Streaming是比Socket连接更好的选择。
而对于Http poll来说,由于HTTP Steaming采用一个HTTP线程监听,一个HTTP线程取数据,自然延迟要比HTTP Poll小很多,效率也要高出N多倍。
这里,Adobe 的Bug追踪系统给出了暂时在IE8下的解决方案:在服务器上,配置services-config.xml (一般在WEB-INF/flex/下)对max-streaming-clients 这个属性进行配置。