浅论Flex和Html5的未来

江麟

Html5+css3的完美搭配为前端开发者打开了新大门，让人不禁叹服于其快捷和方便。

HTML 5的出现让Flex更加专注某些方向和领域。所以，它们是互补的，而非替代。

与曾经的强势不同，flash开始慢慢淡化在IT新闻大潮中，Adobe公司先后放弃了Linux环境下的、TV端的flash，最后终于放弃了移动端的flash，可谓损失惨重，却没有太详细的理由说明原因，只有Adobe副总裁兼交互开发业务总经理丹尼·维诺科(Danny Winokur)在公司网站上发表博客称：Adobe将不再为移动浏览器开发Flash Player，公司未来的发展方向是桌面浏览器、移动应用和HTML5。

Flex和Flash将要消失？

从Html5技术强势崛起、在各大IT公司一呼百应可看出，Html5技术的日渐完善才是Adobe忍痛割爱的直接原因，甚至被放弃的不止这些胎死腹中的计划，flash应用开发的利器flash builder（Flex项目开发平台）也被赠与开源社区，一时间人们仿佛看到了flash的末日，开发者放弃flash项目，二次开发公司放弃基于flex的应用服务，更愿意提及的是Html5这个即将完善、“无所不能”的“超人”。

盲目的屈从和跟风往往是导致身陷囹圄、进退维谷的重要原因，在疏远flash的时候，我们是否该想想：为什么要放弃一个成熟的技术，为什么在自己、用户、产品都习惯了flash时突然去改变它，选择的替代品是否有足够的能力胜任功能和业务的需求。大多数人在赞扬Html5的优点，抨击flash的缺点时并未仔细考虑过匆忙中下的结论是否真的符合Flash、Html5在当前IT形式下所扮演的角色，是否对Flash这个若干年来勤勤恳恳为网页绚丽的效果和稳定的视频播放环境提供支持的元勋足够公平，是否对Html5这个很多功能尚处在商议和争论中的新产品有些神化的夸大。

作为地图服务运营商，高德公司几乎在Adobe宣布Flex开源化和停止更新的不久，就下架了flash地图api，未下架的flex版的维护和更新也几乎停滞，将更多的精力转入Html5的研发计划。面对大量的技术人员转入Html5、越来越多的服务提供商停滞flex产品版本更新或关闭服务，我们是否惶恐：未来不久某天flash突然消失，flash服务突然关闭，Adobe公司完全放弃flash，我们的项目该怎么办？客户该怎么办？

怎么办？微软公司很好地给出了解答，4月8日微软终止提供Windows XP全部技术支持服务，相关漏洞补丁一并停止提供。人们在惶惶中发现，4月9日XP系统依然能用。显而易见，停止更新并不意味着软件用不了。同样，即便Adobe公司放弃Flex，Html5淡化Flash的重要地位，并不意味着它们不能再被使用，我们依然能用Flex编译出Flash文件，依然可以通过开源社区获取最新的版本更新，可以使用Flash Player观看喜欢的电影，可以开发基于Flex的项目，依然可以继续打开那些熟悉的Flash网站。Flash、Flex还不会消失，至少从目前来看。

Flex的优势

Flex这个让普通程序员开发制作Flash成可能的互联网技术巨头，如今为何几乎被Html5死死压制着？

我们先来细说一下Flex，Flex最早是由Macromedia公司开发的一种语言和编译器，版本是Flex 1.0和Flex 1.5，后由Adobe公司接手，分别于2006年、2008年和2010年发布了Flex 2.0、Flex 3.0和Flex 4。从功能上看，Flex应用程序与AJAX应用程序十分相似，都能够动态更新用户界面，在后台发送和加载数据，但是更简单、更快捷是Flex制胜法宝。

其内置的面向对象编程语言ActionScript，增强了FlashPlatform的能力，虽然较早版本的ActionScript提供的强大功能和灵活性已足以创建富有魅力的在线体验，但是新版本ActionScript 3.0更一步增强了语言，即使对着有巨大数据集合完全面向对象的可重用代码的最复杂应用程序，ActionScript 3.0也能帮得上忙。Flex中的MXML是一种XML语言，通过声明性XML语法简化了创建和维护界面的工作，不必编写和维护ActionScript代码，就可以方便地创建可视的、具有多层结构的复杂UI。在构建Flex应用程序时，MXML会自动被编译为ActionScript。flex优势公认有如下几个方面：

解决异步调用：前后台数据交互做到不刷新页面，不用担心浏览器兼容性。

对流媒体的支持：Flex是被公认为流媒体技术支持最好的应用。

跨平台：Flash player能够在Linux环境下、手机上运行，不用担心被绑死在Windows上

对底层的可操作性：Flex能够调用底层的东西，如可调用摄像头实现视频，而且视频本身就嵌入在Flex应用中，由Flex player直接播放

方便：可以用任何你熟悉的WEB编程平台作为后台数据访问层，可以使用webservice、httpservice等等。

Html5优势凸显

Flex有这么多优势，为什么Html5还能替代Flex成为时下IT产业津津乐道的话题？Html5作为Html4的升级版，却绝非简简单单内容的更新，如果说Html4混乱不清的标签语义让每个读写程序的人苦不堪言，那么Html5就像一个修剪得整整齐齐的花园，每个标签都有其固定的位置、特定的语义，在特定的上下文中使用，再也不用像以前div套table再套div，你永远没法一眼看出对应关系，有的只是数不过来的

如果把Html5+Css3优秀的界面效果比作是人换上了光鲜的衣着，那么WebSocket技术的推广就是精神的升华。它代表巨大的进步，真正意义上提供了全双工的通信方式，在Web应用中实现实时数据传输和获取，打破了传统的频繁“发出请求、响应请求”的轮询技术，这对需长连接的程序带来了极大方便，如股票程序、在线IM、强交互性游戏等。在WebSocket之前，基于Ajax的轮询技术“万次连接，万次请求”的连接模式造成了大量的资源浪费和损耗，而WebSocket的“一次连接，任意通信”连接模式在传输数据中除了握手过程，几乎没有杂质信号，无疑是通信模式上一次质的飞跃。

但如同开篇所说，不要去盲目的屈从和跟风，别人在用WebSocket，我就必须要用吗？在某些特定情况下使用Ajax是有天然优势的，如新闻网站、博客、社交网站，它们往往交互性要求并不高，不是时刻都有日志或新闻，持续的、大量的长连接必然会对服务器造成很大压力。

Flex曾引以为傲的便捷拖拽效果，Html5提供同样花样繁多的拖拽操作，只需draggable="true"即可；Flex内置行为和过度效果、平滑的处理渐变效果，Html5+Css3同样提供，代码量还更少；Flex可方便地播放视频和音频，Html5也提供相关标签

Html5的出现就像一记重拳给Flex狠狠一击：你有的我都有，而你不具备的我也提供！

Flex和Flash已渐渐失去市场

Flash曾主导网络视频，市场份额高达81%。Html5推出视频和音频后带给它的冲击不言而喻。很多人对Flash早已不满，乔布斯就曾说“他们有潜力做些有趣的事情，但就是拒绝那样去做……无论何时，只要是Mac电脑崩溃时，都更有可能是由于Flash的缘故，而不是与其无关。”乔布斯所言或许过激，但不无道理。

浏览一些基于flash页面的大型网站时，内存直飚上百兆屡见不鲜，若电脑内存稍低，打开的其他占用内存的软件过多或是Flash页面的内存释放机制没有处理好，都可能导致页面崩溃、内存泄露。flex编译出的SWF文件过大是导致用户体验变差的直接原因。著名的恐怖网页游戏《Hotel626》就是如此：优秀的画面直追电影，但若你第一次运行且没有任何缓存，想加载完是一件很辛苦的事情——它太大了！我还见过一位群友为酒庄做了一个精美的纯Flash网站，大量唯美图片，第一眼看去谁都会喜欢上，但如果客户的网速极慢或极不稳定，那么打开这个网站至少要几分钟，没人愿意这么做。

我们不缺少互联网公司，但网速实在堪忧，即便服务商提供10M、20M甚至更多带宽，但又有多少带宽是我们能够驾驭的？总之，我国的总体网络速度仍处在较低的水平，这就制约了Flash用户群体。

即使如此，Adobe公司仍旧称“将继续保持Flash Player代码库的现代化进程，确保Flash的运行环境(Runtime)在未来5至10年的时间内满足开发者的需求。”

为何它在将大量人力物力转移至开发Html5后仍做出这样的决定？在网上随便一搜就能找到对Html5充满希望的文帖，力挺Flex的人则寥寥无几，难道不该立刻放弃Flex转入Html5的怀抱么？就如同开篇所提的，我们要去想想为何要放弃，为何要改变，替代品是否有足够的能力胜任？一个成熟技术被替代的原因只有两个：其一是有一个更成熟、更稳定、更优秀的技术出现；其二是这个技术已经跟不上时代所需。

替代Flex？Html5还没准备好

要满足第一个条件，Html的兼容性从一开始就是个难题，不同的浏览器不同的显示效果，有的浏览器干脆不支持显示，刨除专为游戏或视频做的浏览器，网上著名的浏览器多达10余种，谁也不愿意本来干净的快速启动栏被若干个浏览器的快捷方式占据着。Html5致力于改变现状，实现浏览器显示和功能上的统一，丰富了标注、严格规范了语义、增加了属性，但即便做了如此多的努力，到目前为止，各大浏览器间也没能做到完全统一。

首先是功能的支持。如Html5六种典型input元素date、month、week、time、datetime、datetime-local，Opera及Chrome浏览器支持前四种和最后者，Firefox则都不支持。使用Html5test检测三者（Chrome34.0.1847.137m、Firefox29.0.1、Opera21.0.1432.67皆为当前最新版本，低版本支持的会更少）对Html5的支持情况会发现：Chrome支持其中485个规范，Opera支持476个，而Firefox仅为447个，这说明同样的代码只能运行在某一款浏览器上，甚至都不支持。对此IE官网的回答是：“现在我们所提供的支持都是非常安全稳定的，今后也将优先对那些在民众那里获得非常高的渴望度的功能进行支持。不管什么功能一下子全部提供支持，或者说为了迎合企业用户而特意对某些功能提供支持的话，这种支持是十分不安全、不稳定的，所以我们不希望采取这种做法。”可见支持Html5所有标签尚需不短的时间。

其次是显示样式和CSS上的不统一，Html5之所以被追捧，绝非仅依靠Html5本身，而是依靠Html5+CSS+javascript这个强势的前端显示组合。CSS3的标准写法目前还不能被所有浏览器支持，许多浏览器需要加上自身特殊的前缀，例如线性渐变linear-gradient属性在WebKit内核浏览器里的写法为-webkit-linear-gradient，在Opera的写法为-o-linear-gradient，在Firefox的写法为-moz-linear-gradient，而目前要想在指定的浏览器里正常显示样式就必须加入该浏览器特定的前缀才行。要实现一个效果并在2个或2个以上的浏览器里兼容，至少要写两次同样的CSS代码。各个浏览器对Html5标签的显示样式也并不统一，如：color类型的input标签在Chrome和Opera默认显示为接近于正方形的形状，在Firefox里则被默认显示成长方形，更扁更宽。

再次是浏览器版本问题，尽管IE6浏览器在中国的市占率已从2010年的59.67%下降至2014年5月的28.26%，但中国IE6用户量仍高居世界首位，拙劣的CSS样式，支持javascript总是出现匪夷所思的问题，连Html4的支持都会出现问题的IE6又如何能支持Html5？IE官方明确表示只有IE8以上的版本才支持Html5，而Chrome、Opera和FireFox都需要使用最新的版本才能获得优秀的Html5体验，这就迫使用户必须不断升级浏览器，对那些无法联网的计算机来说，这是一个棘手的问题，就算能够无限制的连接网络，又有多少用户愿意频繁地更新浏览器呢？用户群体中存在的大量低版本浏览器是阻碍Html5打开市场缺口的又一个直接原因。

技术被描绘得前景再好，内里功能再创新，也要有应用支持、用户认可才行。相较高调发布，Html5后续市场化力度的疲乏使越来越多的人对它是否真正改变当前互联网技术的格局产生了质疑，其中较有名的是“Html5 骗局论”，sk-flash网站在《Html5的无需插件骗局》文章中写道：“HTML5在天下人面前撒下了弥天大谎：在目前世界绝大多数的电脑上要运行HTML5程序，都必须安装比插件更可怕，名字叫IE9/Firefox/Chrome的浏览器；如果说插件已足够让客户/玩家闻风丧胆，那么安装浏览器不等同于自掘坟墓？”矛头直指当前“混乱不堪”的浏览器市场。cnBeta在《Html5只是个陷阱 Adobe本该坚持》中质疑它能否成功取得移动端领袖地位：“现在整个移动领域广泛宣传 HTML5 的兼容性，可能是个陷阱。为了成功，开发者需要把各个平台区分开来对待。而在非 HTML5 时代，可能你建立的应用只适用于最新最好的硬件平台，没错，一般用户使用它的机会概率变小了，但每一个购买了新设备的人会偏向于使用它。你的应用越能发挥新硬件平台的优势，硬件和系统提供商就会越倾向于帮你宣传应用，这会给你带来一些意想不到的效果。一旦你的应用中一个新硬件平台上获得了成功，那么你就可以开始侵占其它硬件平台的行动了。而对于那些试图一次性征服所有平台的开发者，通常都找不到市场营销合作伙伴，或者说，在一个所有人都不会输的时代，也很难有人赢。HTML5 杀不死移动应用。”

Html5绝非一场真骗局，只是需要被完善的太多了。一个视频格式便让众多“义务”参与进Html5规则制定的大公司争得不可开交，毕竟有几家公司是抛却自身利益真正为其服务的呢？没有争议的是用户依然可以使用Flash。作为先驱，YoTube率先在视频播放加入了Html5，只是播放的锯齿感实在太强烈，最终团队选择了兼容Flash和Html5。这证明Flex在目前来看相比Html5还是有可取之处的，其优势在于大量的开发者、简介清晰的开发和调试功能、众多的控件类、高效的文档处理能力以及Flash拥有大量的用户。Html5属于无需插件就能在浏览器中运行，使用快捷小巧，支持不逊于Flex的视图效果和控件类型，对数据和文档的处理能强，图文混排能力极强，编写框架清晰，但低效的调试一直是Html系列的尴尬，尽管VS2010在处理javascript方面强大了很多，但仍不能有效检测所有错误。

不是替代，而是互补

套用OsChina.NET社区《浅谈Flash/Flex/Html5技术选型》一文中的话：“HTML 5与Flex是两种截然不同的技术解决方案。HTML 5的出现让Flex更加专注某些方向和领域。所以，它们是互补的，而非替代。因此，‘替代一说并不准确。”Flex和Html5目前优缺点都很明显，在项目中配合使用是非常好的选择，Html5优秀的页面布局可承担页面总体框架，强大的数据展示效果可以方便、清晰地展示各种数据，Flex则可帮助Html5完成视频音频的加载，数据统计中的柱状图、条形图，并可以在页面局部加载动画，这些都是丰富页面的绝佳功能，而Flex所实现的功能并非网页的全部，也并非网页加载完成后最迫切展示给用户的部分，所以可以让用户稍等一会，先去看Html5加载完成的主要内容。这很有可能是Html5还未完善，但是已有大部分用户接受并选择它后，网页最佳的展现方式。谁又敢保证未来不是Html5的天下呢？

结语

Html5会慢慢的完善并替代Flex，但事实证明为时尚早，Flex就如同夕阳依旧散发着它的光芒，不再耀眼但不可或缺，Html5也如朝阳般冉冉升起，也许终有一天Flex，Flash将消失在我们的生活中，现在人们还离不开Flex、Flash，却向往着Html5。取二者的优点兼而得之才是上上之选，双赢永远是大家乐见并支持的。最后套用Adobe首席技术官Kevin Lynch的话：“我们将为HTML5开发工具，开发全球最好的工具。这无关HTML5与Flash的对抗，它们之间可以实现双赢，最重要的是自由的web选择权。”