写点什么

百度技术沙龙第 1​7 期回顾:​富客户端时代的 JavaScript 框架(含资料下载)

  • 2011-08-24
  • 本文字数:2303 字

    阅读完需:约 8 分钟

在 8 月 20 日百度主办、InfoQ 策划组织实施的第 17 期百度技术沙龙活动上,来自百度商务搜索部前端工程师董睿以及 IBM 中国开发中心的高级软件工程师成富,分别分享了 JavaScript 框架的相关话题,话题涉及企业级 RIA 框架的应用以及实际产品开发中的 Dojo 框架。本文将对他们各自的分享做下简单的回顾,同时提供相关资料的下载。

主题一:整站式 Ajax 应用开发与 ER(Enterprise RIA)框架视频,MP3 和 Slides 等资料下载

来自百度的前端工程师董睿第一个为大家分享,演讲内容涵盖整站式 Ajax 应用介绍、ER(Enterprise RIA)框架介绍以及整站式 Ajax 与 ER 框架的应用开发,其中重点讲述了整站式 Ajax 与 ER 框架在实际开发中的应用。董睿首先列举了常见开发中遇到的问题:​​​​​​

  • URL 敏感
  • 浏览器的前进后退
  • 处理 Location 对应的请求行为(数据加载、视图渲染等)
  • Action 太多,乱七八糟
  • 数据怎么管理
  • 数据可能被多个场景使用
  • 在 JavaScript 里写 HTML 片段很不爽(换行、转义等)
  • UI 控件管理界面交互
  • 复杂区块的渲染
  • 频繁的 new 与 append
  • 进入页面的时候加载的 Js 文件太大​

在 ER 框架中,主要的解决方法有:

  • 封装 Locator(当 Locator 变更时,Locator 通知 Router 分发到某个 JavaScript Function 进行处理)
  • Controller 转交给某个 Object 进行处理(Action)
  • Action 对模型与视图进行选择与匹配,完成用户行为的处理
  • 对相似业务逻辑的 Action 进行归类
  • 数据的存储容器
  • 针对 propertychange 的事件监听机制
  • public 与 private 分级
  • 使用 HTML 注释
  • 支持不闭合声明
  • 支持对 model 和 JS Object 的引用:${}
  • 不提供流程控制的支持
  • 通过自定义 ui 标签来实现便捷的控件创建方式
  • 通过“*”来实现方便的引用 Context 中的数据
  • controller 根据 path 选择 Action 时,自动加载,以此来解决加载 Js 文件太大的问题

此外,董睿还分别从目录结构、架构的分层结构、开发时的 JavaScript 管理、开发时的 CSS 管理、开发时的 template 管理以及打包与压缩等常见的场景,通过具体的代码示例以及相应的总结,将其在开发中的经验加以分享。

最后,董睿总结了 ER 框架所具备的特性:实现了历史记录,前进后退等功能的封装、URL 敏感,处理 Location 对应的请求,提供数据环境,数据模型,HTML 片段编写的便利性,控件的加载与业务行为,按需加载,目录结构以及开发时的源代码管理等。​

主题二:实际产品开发中的 Dojo视频,MP3 和 Slides 等资料下载

成富主要从 JavaScript 框架的世界讲起,阐述为什么要选择 Dojo 这么一个开源的产品,然后介绍了实际产品和项目中的 Dojo 开发,最后总结了其在长期的使用过程中所遇到的经验与教训。

成富在演讲中提到,之所以 IBM 选择 Dojo 作为 IBM 的 RIA 标准框架,是因为 Dojo 具有交互性要求高、企业内联网和适合团队开发等特点。目前在 IBM,广泛使用 Dojo 框架的产品有 IBM Mashup Center、IBM Connections、Lotus Live。

接下来成富重点介绍了实际项目中的 Dojo 开发流程以及注意事项,只用 Dojo 的基本开发流程为:

  • 界面草图(草图设计)
  • 布局(使用布局组件手动控制)
  • 组件(使用标准组件、扩展标准组件、自定义组件或是复用其它组件等)
  • 界面(组件交互)

成富建议的组件使用路线图为:找到组件、直接使用组件、扩展组件,以及把组件功能发挥到极致的自定义组件。此外,成富还对组件从属性和方法的层面进行了剖析,介绍了组件的创建、销毁、交互以及扩展的注意点。在自定义组件时有以下几点需要注意:​

  • 组件粒度的权衡(可复用性 vs 性能)。
  • 组件的生命周期管理(创建与销毁)。
  • 遵循惯例(属性和方法的命名,使用 dijit._widget 的方法)。
  • 善用模板和容器(用 HTML 模板来创建基本骨架,继承 dijit._Container 来管理内部子组件)。

​最后,成富分享了其在开发中的经验和教训,目前主要面临的非功能性需求主要有:

  • 性能问题
  • 内存占有率和内存泄露问题
  • 可访问性
  • 单元测试​

以上问题的应对机制分别为:打包和压缩代码、控制页面上的组件数量,添加正确的组件销毁逻辑等。此外 Dojo 是首个提供支持完全可访问性组件库的 JavaScript 框架,还支持 W3C 的 ARIA 标准。单元测试的工作是通过 D.O.H 来进行逻辑单元测试的,同时使用 D.O.H Robot 还可进行界面相关的单元测试。

Open Space(开放式讨论环节)

和以往的环节一样,​为了让参会者能够有更多的时间进行相互的交流,本次活动依然设置了 Open ​Space(开放式讨论)环节。除了讲师​董睿和成富外,王文明、杨飞、贾珣也参与了小组讨论。在 Open Space 的总结环节,几位嘉宾​分别对讨论的内容进行了总结:​​

董睿分享了“Web 资源(文本)压缩”的话题,主要提到了 JavaScript 和 HTML 的一些压缩策略以及针对搜索引擎的优化策略等。​​成富则继续他演讲的话题“JS 框架在实际开发中的应用”,参会者对 Dojo 产生了浓厚的兴趣,成富对相关问题进行了解答,大家进行了深入的讨论,最后还讨论了关于常见 RIA 框架的一些问题。此外,王文明、杨飞、贾珣分别分享了“Zend Framework 快速开发和 PHP 性能优化”、“富客户端与轻量级互联网应用”以及“Node.js 的前景”等话题。

​​​​会后一些网友在新浪微博分享了他们参会的感受:

@陆明在京:今天下午百度技术沙龙主题和实用性都不错,蛮有价值的。

@北京辛星:#百度技术沙龙#今天参加百度技术沙龙,对 js 富客户端有了更多的了解,谢谢组织者和分享话题的各位。

@甘志:#百度技术沙龙# 提供的冰啤酒不错,内容也很精彩,以后要多参加。

​有关百度技术沙龙的更多信息,可以通过新浪微博关注 ** @百度技术沙龙,或者加入百度技术沙龙微群 **,InfoQ 上也总结了过往 15 期所有百度技术沙龙的演讲视频和资料等,感兴趣的读者可以直接浏览阅读

2011-08-24 20:284634
用户头像

发布了 156 篇内容, 共 55.4 次阅读, 收获喜欢 7 次。

关注

评论

发布
暂无评论
发现更多内容

【架构实战营】第 7 模块作业

swordman

架构实战营

接任务时一定要锁定需求啊!(转自小明同学)

BinTools图尔兹

数据库 dba 国产数据库 运维开发

Flink进入大厂面试准备,收藏这一篇就够了

五分钟学大数据

flink 7月日更

相约山城重庆!HarmonyOS Connect伙伴峰会将于7月16日举办

科技汇

MindSpore教程免费学,还有入门奖品

Geek_6cdeb6

人工智能 机器学习 深度学习 自我提升 羊毛

正式发布!中国首个LF Edge捐赠项目Baetyl 2.2发布

百度开发者中心

物联网 开源技术

网络攻防学习笔记 Day68

穿过生命散发芬芳

网络攻防 7月日更

3分钟评估 你的运维监控系统是“救命稻草”还是“鸡肋”

鹿小U

运维自动化 监控系统 运维平台

半年摸爬滚打,我是如何从小白进阶渗透测试工程师

网络安全学海

黑客 网络安全 信息安全 渗透测试 漏洞分析

云南智慧公安研判分析系统搭建,重点人员研判分析平台

构筑智能制造时代“四重护城河”,联想中国开创产业新格局

科技大数据

北鲲云助力生命科学,高性能计算突破屏障

北鲲云

Clickhouse Projection 特性探索

GrowingIO技术专栏

数据库 大数据 数据分析 OLAP Clickhouse

再获权威认可!DataPipeline实时数据融合平台通过信通院大数据产品能力评测

DataPipeline数见科技

大数据 数据融合 数据管理

图的应用——拓扑排序

若尘

数据结构 拓扑排序

阿里P8手抄本惨遭泄露,并出现病毒式传播,致28人斩获大厂offer

Java架构师迁哥

技术干货 | 录屏采集实现教程 —— Android端

ZEGO即构

大前端 音视频 录屏采集 Android端

CDH 的安装(四)

大数据技术指南

CDH 7月日更

香帅:2021年财富格局新变化

石云升

读书笔记 7月日更

爆款阿里P5到P7晋升之路,九大源码文档助我超神果然努力幸运并存

Java BAT

“用友 • 华为云杯”第三届企业云服务开发者大赛

ToB行业头条

开发者 低代码 用友

我是如何从设计师转到软件行业的? | 可怜巴巴的程序猿

Python研究所

随笔 话题讨论

聊聊事务与分布式系统-从零讲到通透

刘绍

sql 分布式 事务 2PC XA

每天学习10个实用Javascript代码片段(三)

devpoint

JavaScript JSON格式化 7月日更

一图读懂DataPipeline实时数据融合平台V3.0

DataPipeline数见科技

大数据 数据融合 数据管理

Redis学习之Redis概述及原理、基本操作及持久化

Linux服务器开发

redis 分布式 后端 中间件 Linux服务器开发

“京东商城”亿级高并发秒杀系统到底是怎么设计的?自己做该如何下手?

Java架构师迁哥

百度搜索稳定性问题分析的故事(上)

百度开发者中心

百度搜索

【Redis】数据结构

awen

redis 数据结构

模块七 - 王者荣耀商城异地多活架构设计

华仔架构训练营

5分钟学会本地Pypi源搭建

Python研究所

Python

百度技术沙龙第1​7期回顾:​富客户端时代的JavaScript框架(含资料下载)_Web框架_贾国清_InfoQ精选文章