说明:信息系统实践手记系列是系笔者在平时研发中先后遇到的大小的问题,也许朴实和细微,但往往却是经常遇到的问题。笔者对其中比较典型的加以收集,描述,归纳和分享。

摘要:此文描述了笔者接触过的部分信息系统或平台之间的对接构型和情况,挂一漏万的总结分享之。

正文

系列随笔目录:信息系统实践手记 (http://www.cnblogs.com/taichu/p/5305603.html

作者:太初

转载说明:请指明原作者,连接,及出处。

正文

在笔者实践中,越到有些情况下(比如开发GIS地图应用),客户端的JS代码往往要调用GIS地图引擎的API。

有些API提供JS接口(版本),那是最方便的,有些提供诸如FLEX编程接口的API,让你在JS中调用,也是可以,但遇到如下情况,分享之。

我们的客户端是基于GIS地图的应用,用JS代码调用FLEX的API接口,需要通过FLEX的语句在GIS地图上呈现(放置)2万个对象(Object)。

方法A(老方法):

  1. 在JS中,通过业务层得到2万个设备的信息数据,诸如数组DEV[20000];
  2. 在JS中,将信息数据打包为hashmap(key -> value);
  3. 在JS中,将hashmap数据结构从JS传入Flex: JS --> Flex;
  4. 在Flex中,获得传入的hashmap结构,并循环显示在GIS地图上;
  5. 在Flex中,通过hashmap结构提供用key查value的服务:val = devicehashmap.get(key);

性能评估&分析:

  1. 在步骤2,3,4中消耗了20秒左右,数据量是2万个device;主要是步骤3较慢;
  2. 初步估计,JS中组成hashmap结构需要花费一定时间,但不多;可惜这种高级结构对JS/Flex两侧是个负担,传入的时候需要做必要的检查和转换,所以比较慢;
  3. 另外,考虑到JS/Flex相互调用结构比较复杂,如果传递高级结构,两侧系统容易在解析上不一致而会引起额外的开销;

(备注:其实还尝试过方法A的变种,就是在JS这里启动循环2万次,每次将一条设备信息传递给Flex并在GIS地图上显示Object,虽然每次数据量极小,但是来回调用JS/Flex2万次,效率更低下,所以也舍弃了,这里就不再讨论了)

方法B(新方法):

  1. 在JS中,通过业务层得到2万个设备的信息数据,诸如数组DEV[20000];
  2. 在JS中,将信息数据打包为长字符串String(带约定结构/类似JSON);
  3. 在JS中,将String从JS传入Flex: JS --> Flex;
  4. 在Flex中,获得传入String,并解析还原为hashmap,并循环显示在GIS地图上;
  5. 在Flex中,通过hashmap结构提供用key查value的服务:val = devicehashmap.get(key);

性能评估&分析:

  1. 在步骤3中消耗了1秒左右(其实是500ms左右),数据量是2万个device;
  2. 初步估计,经典的数据结构String,在大多数系统中都能很好的互操作,并获得最简单的支持和解析(比如大都是bytes字节数组,最后一个是标记,或者有一个小小的优雅的头结构等等),所以传递String极大的降低了时间开销。而对JS侧,拼接String比组装hashmap更快些;在Flex侧,自己解析String组装自己的haspmap(不是理解JS的hashmap结构)也很快。
  3. 总体上步骤1到5消耗在1秒左右,达到要求;

(备注:其实在尝试几种其他GIS引擎的时候,我们采用JS/API接口,就没有遇到如上的问题,这其实对技术选型是很重要的。)

总结:

  1. 很多时候,我们开发一个系统,实现了A和B的互相调用和操作,只是达成而已。更多情况下实际应用场景必然有数据压力和性能要求,而一旦上了性能,“可用”就不够了,还要考虑“可行”;
  2. 从众多的方法中找到切实可行的,才是最终目的。这其实要求对各种方法的理解和比对有深入的研究。但时间有限,经验有限,人力有限,所以只能做代价有限的尝试,并不断优化,这可能也是迭代开发或敏捷开发比较提倡的吧。
  3. 性能优化我在之前的篇幅已经粗略的谈到,只要有性能瓶颈,只要未达到物理(理论)可计算的性能边界,就能找到合适的方法来优化。
  4. 另外,技术选型也很重要,对于目前我们接触的几个GIS引擎,支持JSAPI的都未出现类似问题,而非JS的API接口就需要做额外的研究,尝试和优化。这对技术选型也是一个值得思考的例子。

信息系统实践手记6-JS调用Flex的性能问题一例的更多相关文章

  1. 2016-04-25-信息系统实践手记6-JS调用Flex的性能问题一例

    layout: post title: 2016-04-25-信息系统实践手记6-JS调用Flex的性能问题一例 key: 20160425 tags: GIS JS FLEX 技术选型 性能 API ...

  2. 信息系统实践手记5-CACHE设计一例

    说明:信息系统实践手记系列是系笔者在平时研发中先后遇到的大小的问题,也许朴实和细微,但往往却是经常遇到的问题.笔者对其中比较典型的加以收集,描述,归纳和分享. 摘要:此文描述了笔者接触过的部分信息系统 ...

  3. 2016-04-25-信息系统实践手记5-CACHE设计一例

    layout: post title: 2016-04-25-信息系统实践手记5-CACHE设计一例 key: 20160425 tags: 业务 场景 CACHE 系统分析 系统设计 缓存 modi ...

  4. 【FLEX教程】#007 如何让JS调用SWF里的方法

    HTML中,JS如何调用SWF里面已经封装好的代码呢? 有一些事情Flex没办法实现的,需要通过调用JS来实现. eg: 当浏览器窗体关闭的时候,弹出一个对话框,提示用户是否退出?或者是否保存当前的操 ...

  5. [iOS Hybrid实践:UIWebView中Html中用JS调用OC方法,OC执行JS代码]

    原理: 1.JS调用OC 每次webview执行跳转时都会被iOS给拦截,执行下面函数获得系统允许. 因此可以根据跳转信息转给系统,执行相应功能,比如打开相册等. // 网页中的每一个请求都会被触发 ...

  6. JS 与Flex交互:html中的js 与flex中的actionScript通信

    Flex与JavaScript交互的问题,这里和大家分享一下,主要包括Flex调用JavaScript中的函数和JavaScript调用Flex中的函数两大部分内容. Flex 与JavaScript ...

  7. js 调用栈机制与ES6尾调用优化介绍

    调用栈的英文名叫做Call Stack,大家或多或少是有听过的,但是对于js调用栈的工作方式以及如何在工作中利用这一特性,大部分人可能没有进行过更深入的研究,这块内容可以说对我们前端来说就是所谓的基础 ...

  8. Auto.js 调用系统短信、电话

    本文所有教程及源码.软件仅为技术研究.不涉及计算机信息系统功能的删除.修改.增加.干扰,更不会影响计算机信息系统的正常运行.不得将代码用于非法用途,如侵立删! Auto.js 调用系统短信.电话 操作 ...

  9. JS调用Android、Ios原生控件

    在上一篇博客中已经和大家聊了,关于JS与Android.Ios原生控件之间相互通信的详细代码实现,今天我们一起聊一下JS调用Android.Ios通信的相同点和不同点,以便帮助我们在进行混合式开发时, ...

随机推荐

  1. IOCP Internals

    Buffer Type Buffer I/O 针对Buffer I/O的请求,系统会为其分配一个非换页内存作为缓存区,其大小等同于I/O请求的缓存区大小.对于写操作,I/O管理器在创建IRP时,将请求 ...

  2. 【初探Spring】------Spring IOC(一)

    IOC:Inversion of Control(控制反转).IOC它所体现的并不是一种技术,而是一种思想,一种将设计好的对象交给容器来管理的思想.IOC的核心思想就体现在控制.反转这两个词上面,要理 ...

  3. 更有效率的使用Visual Studio(二)

    没想到上一篇文章有这么多人喜欢,多谢大家支持.继续- 很多比较通用的快捷键的默认设置其实是有一些缩写在里面的,这个估计也是MS帮助我们记忆.比如说注释代码的快捷键是Ctrl + E + C,我们如果知 ...

  4. CSharpGL(24)用ComputeShader实现一个简单的图像边缘检测功能

    CSharpGL(24)用ComputeShader实现一个简单的图像边缘检测功能 效果图 这是红宝书里的例子,在这个例子中,下述功能全部登场,因此这个例子可作为使用Compute Shader的典型 ...

  5. Apache thrift RPC 双向通信

    在上一篇介绍Apache thrift 安装和使用,写了一个简单的demo,讲解thrift服务的发布和客户端调用,但只是单向的客户端发送消息,服务端接收消息.而客户端却得不到服务器的响应. 在不涉及 ...

  6. 06. Web大前端时代之:HTML5+CSS3入门系列~HTML5 画布

    Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 我们先看看画布的魅力: 初始画布 canvas默认是宽3 ...

  7. 【Win 10 应用开发】加载外部的 srt 字幕

    据说系统内置的多媒体功能支持 srt. ssa 等字幕,老周测试过几种格式的字幕均能加载. SRT 字幕是最简单的字幕结构,甚至你用记事本都能做出来,就是分为几行来写. 第一行是字幕的编号,应该是从1 ...

  8. java监控之ManagementFactory分析

    The ManagementFactory class is a factory class for getting managed beans for the Java platform. This ...

  9. iOS开发——创建你自己的Framework

    如果你想将你开发的控件与别人分享,一种方法是直接提供源代码文件.然而,这种方法并不是很优雅.它会暴露所有的实现细节,而这些实现你可能并不想开源出来.此外,开发者也可能并不想看到你的所有代码,因为他们可 ...

  10. 放弃安卓原生TimePicker,选择wheelView打造更漂亮的时间get,以及动态拉伸输入框布局,这些,这里都有!

    最近公司要求的上线项目有这么一个需求,要写一个请假申请的页面,里面必须有请假开始时间,结束时间,还有一个请假原因. 于是想到时间选择嘛,官方不是有个DatePicker吗?额,是不是要DatePick ...