写点什么

James Ward 谈使用 HTML5 和 Java 开发客户端 / 服务器应用

2012 年 12 月 13 日

谈到应用开发,不管是客户端 / 服务器类应用、传统的 Web 应用还是移动 Web 应用,最近的趋势是使用像流式网格布局(Fluid Grid Layout)和响应式网页设计(Responsive Web Design)这样的模式,以及像 HTML5、CSS3 和 JavaScript(客户端和服务器都支持)这样的技术。

此外,用于构建客户端现代 Web 应用(包括桌面应用和移动应用)的工具发展和变化都非常迅速。十年之前为了在服务器端处理 HTML UI 而构建的一切,现在都在客户端重新实现了,如 MVC 框架、模板库和组件库等。jQuery 是大多数现代应用的基础,因为从某种程度上说,它有点像 JavaScript 标准库。MVC 我们有很多选择,但是像 Backbone.js 这样的框架是越来越引人注目了。客户端模板库也有很多。其中有些技术既可以工作于客户端,又可以工作于服务器端;如果有的用户的浏览器中没有现代或快速的 JavaScript 引擎,这些技术是派得上用场的。

在今年的 JavaOne 2012 会议上,来自 TypeSafe 的 James Ward 做了一个讲座,内容就是使用HTML5 和Java 技术开发客户端/ 服务器类应用。

InfoQ 采访到了 James,探讨了他在这次会议上的讲座以及这种新的应用开发趋势。

InfoQ:请问开发者对基于 Java 的 HTML5 框架有哪些要求?

James:现代 Web 应用的新模型与老式的客户端 / 服务器架构类似,不过这时客户端变成了支持 JavaScript、CSS 和 HTML 的浏览器,而服务端则是 RESTful JSON 服务。在寻找现代 Java Web 框架时,你需要关注以下三个方面:

  1. 这一 Web 框架是不是对构建客户端和服务器都有帮助?现代 Web 框架通常会提供“Asset Compilers”或“Asset Pipelines”,辅助开发者编写 JavaScript、CoffeeScript 和 LESS。例如,Play Framework 所带的 Asset Compiler,将服务端代码(Java 或 Scala)和客户端代码(JavaScript、CoffeeScript 和 LESS)的编写体验统一起来。
  2. 能否像管理服务端依赖一样管理客户端依赖?越来越多的代码正在移向客户端(JavaScript 和 CSS 等)。这意味着 jQuery、Bootstrap 和 Backbone 等客户端库的使用也会越来越多。因此,我们需要像管理服务端依赖一样管理客户端依赖(及其传递依赖)。我创建了“WebJars”项目(www.webjars.org),把常见的客户端库打包成 Jar 文件,这样就可以将其包含到 Maven(或其他构建工具)依赖列表中了。
  3. 创建 RESTful JSON 服务是不是很容易? RESTful JSON 是目前向客户端暴露数据和服务的事实标准;不需要考虑客户端是移动应用还是现代 Web 应用(包括桌面或移动应用)。从 HTTP 动词和路径向后端服务的映射应该非常简单,而且是声明式的。大多数现代 Web 框架(如 JAX-RS、Play Framework、Spray 和 BlueEyes 等)都支持这一点。

InfoQ:你能否谈一下在使用 Java 和 HTML5 开发客户端 / 服务器或移动 Web 应用时,在设计方面应该考虑哪些因素?

James:新的现代 Web 架构与传统的 Web 应用是非常不同的。要理解这些新架构所考虑的因素,最好是听一听那些已经成功地以这种方式构建过应用的人是怎么说的。下面是两个很好的资源,它们就是由成功构建过现代 Web 应用的人提供的:

InfoQ:你的讲座中提到了无状态 Web 层架构。你能否更多地讨论一下,它对移动 Web 应用有何帮助?

James:现代 Web 应用的优势是,UI 状态从服务器移到了客户端。无状态的 Web 层使如下四个方面得以简化:

  1. Web 层不包含状态时,水平伸缩很容易。这使 Web 层可以独立并即时地伸缩。
  2. 在无状态的 Web 层中,持续交付也更容易了,因为部署新版本时无需担心会话状态。
  3. RESTful 服务应该是无状态的。每个请求都是原子的,不依赖于前面的任何请求。
  4. 不管是采用自动化测试(如单元测试或功能测试),还是开发者在其浏览器中通过点击刷新的方式测试新代码,无状态 Web 应用测试起来都要容易得多。在构建 Play Framework 应用时,我的典型开发周期很简单:编辑代码,保存,然后重新加载浏览器或重新运行自动化测试。这种开发过程非常有效,部分原因就是 Play Framework 应用是无状态的。

InfoQ:请问当使用 Java 和 HTML5 创建移动 Web 应用时,开发者有哪些需要注意的地方?

James:在做出技术决策之前一定要理解用户。如果用户的浏览器不支持比较现代的功能,你可能需要退一步,使用特定的 API 和库。你的用户是哪些人,他们的设备和客户端能提供哪些功能,技术上你可能需要根据这些信息折中一下。

InfoQ:你的讲座中也谈到,浏览器就是新的平台。你能否讨论一下这种新趋势?这种趋势对客户端 / 服务器或者移动 Web 应用的开发和部署方式有何影响呢?

James:Web 浏览器是通用的客户端平台。当然,它并不完美,但是它无处不在,而且一直处于发展之中。大约十年前,我们将 UI 移到了浏览器中,但只是将浏览器用做渲染标记(UI+ 数据)的非智能终端,而标记仍是在 Web 服务器上生成的。这种方式的优点是,用户什么都不需要安装,即可使用任何应用。缺点是每次用户交互 UI 都需要重新加载页面。Ajax 这种革命性的技术出现之后,这种局面有所改观,部分 UI 逻辑移向了客户端。现代 Web 和移动应用走得更远,将整个 UI 都移到了客户端。此举提供了最好的用户体验和性能。对于可能需要离线工作或者使用原生 UI 的移动应用而言,这也非常合适。

InfoQ:对于响应式设计和流式网格布局等移动 Web 设计理念,请问你有什么看法?

James:过去,我们的 Web 应用主要是针对一种设备配置而设计的,也就是台式机 / 笔记本。这些设备大多具有相似的屏幕尺寸,所以 Web 应用开发人员不需要考虑其他设备配置。移动和平板设备的增长改变了这一切。开发者需要确保其应用支持种类繁多的设备配置。响应式设计和流式网格布局就是根据设备配置修改应用布局和外观的策略。其中有些策略用到了 CSS Media Queries,让浏览器基于设备配置(如屏幕尺寸)选择不同的 CSS 文件。使用这些策略时,主要还是根据你构建的是什么以及用户需要什么。在不同的设备配置之间,如果只是 UI 和布局有轻微变化,这些方式可以工作地很好。否则,你可能需要查看其他更为重型的策略了。

InfoQ:移动 Web 开发作为一种新趋势,也使其他技术——如 Rest Web 服务和用于服务器和客户端之间交换数据的 JSON——更为流行了。你能否谈一下这些技术?在整个移动 Web 开发中,这两种技术是如何互补的?

James:传统的 Web 应用结合了 UI 和数据。在只有一种客户端,而且 UI 和数据的聚合发生在服务器上时,传统的 Web 应用表现良好。而在现代 Web 和移动应用中,可能有多个客户端使用同样的数据。RESTful 服务提供了一种简单方法,动词和路径可以通过 HTTP 协议映射到资源或数据。JSON 是一种数据序列化方法(将内存中的对象转变为可传输的数据)。XML 是另一种数据序列化方法。多数现代应用都选择了 JSON,因为它极为简单,而且大多数技术对它都有良好地支持。REST 和 JSON 组合起来非常简单,还能支持大量的服务器和客户端技术。

InfoQ:请问 JavaScript 在哪方面比较适合这种新的客户端 / 服务器与移动开发范型?

James:JavaScript 是现代 Web 应用的客户端编程语言。但是 JavaScript 并不完美,所以出现了很多可以编译为 JavaScript 的语言,如 CoffeeScript、TypeScript 和 Dart 等。不管怎样,在现代 Web 应用中,在客户端实际运行 UI 的代码都是 JavaScript。

他也谈到了 Web 与移动应用开发的未来。

James:使用 HTML5 和 Java 开发 Web 和移动应用,未来是非常光明的。客户端和服务器端都有大量的技术可供选择,而且这些技术都发展得非常快。所有这一切最终将帮助我们更容易且更快速地构建更好的应用。对 Web 开发者而言,这是激动人心的时刻。

关于受访人:

James Ward是 Typesafe 的一名技术推广者。目前,他主要关注的是教给开发者如何将 Java、Play! 和 Scala 应用部署到云中。James 经常出席全世界的各种技术会议,如 JavaOne、Devoxx,以及很多其他的 Java 聚会。James 与 Bruce Eckel 合著了《First Steps in Flex》一书。他也发布了大量的教学视频、博客和技术文章。从上个世纪 80 年代使用 Pascal 和汇编语言编程开始,James 发现了他对编写代码的热情。之后在 90 年代初,他开始使用 HTML、Perl/CGI 和 Java 进行 Web 开发。在 2004 年为 Pillar Data Systems 构建了一个基于 Flex 和 Java 的客户服务门户系统之后,他成了 Adobe 的一名 Flex 技术布道者。你可以发现他在通过

@JamesWard 这个 ID 玩 Twitter,他也在

StackOverflow 回答问题,还在

这里提交代码。

查看英文原文: James Ward on Client Server Application Development with HTML5 and Java

2012 年 12 月 13 日 02:506557
用户头像
臧秀涛 略懂技术的运营同学。

发布了 300 篇内容, 共 115.7 次阅读, 收获喜欢 23 次。

关注

评论

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

程序员写个人技术博客的价值与意义

Java架构师迁哥

不正经的计算机专业学生拍摄照片分享

王荣胜

摄影

面试官:谈一下你对DDD的理解?我:马什么梅?

艾小仙

Java 架构 编程语言 领域驱动设计 DDD

谈谈力软快速开发平台B/S专业报表工具

Learun

小程序 敏捷开发 开发者工具 报表

UML图

饺子

Vue-防止重复点击指令

老菜鸟

Vue 指令

食堂就餐卡系统设计

一个节点

极客大学架构师训练营

云图说 | 通过Helm模板快速部署中间件应用

华为云开发者社区

容器 k8s

从构建小系统到架构分布式大系统,Spring Boot2的精髓全在这里了

Java成神之路

Java 编程 程序员 面试 Spring Boot 2

洞爷湖-安静与灵动

刘旭东

摄影 摄影征文 洞爷湖 北海道

司法区块链破解互联网案件审判难

CECBC区块链专委会

区块链技术 不可篡改 法院

[Go] 设置各种选项的最佳套路

eddix

go 设计模式

架构师训练营01周 -- 命题作业

骏马

极客大学架构师训练营

阿里云发布边缘计算视频上云解决方案 为海量视图处理提供城市级云基础设施

阿里云Edge Plus

边缘计算

加速连接效率 阿里云推出5G消息使能平台MEP

阿里云Edge Plus

云栖大会CDN技术专场:如何构建企业级内容分发加速体验?

阿里云Edge Plus

CDN

架构师训练营1期第1周:架构方法 - 总结

piercebn

极客大学架构师训练营

食堂就餐卡系统UML设计 - 架构师训练营第1周作业

netspecial

极客大学架构师训练营

并发+JVM+Redis+MySQL+分布式+微服务等及阿里等大厂最新面试问答

Java成神之路

Java redis spring 面试 JVM

聚焦2020云栖大会 边缘计算专场畅谈技术应用创新

阿里云Edge Plus

第一周学习总结

饺子

多方计算——打开区块链应用新场景

CECBC区块链专委会

区块链 大数据

同事为进大厂天天刷Java面试题,面试却履败!究其原因竟是它在捣鬼。

Java成神之路

Java 程序员 数据结构 面试 算法

Week 1 命题作业

阿泰

抓住这些BUG程序员进大厂也就这回事,工作后2到3年进大厂操作指南

Java架构师迁哥

非暴力拆解:小熊派NB-IoT通信扩展板

华为云开发者社区

IoT 通信 芯片

第一周作业

Geek_4c1353

极客大学架构师训练营

架构方法周总结第一周作业「架构师训练营第 1 期」

天天向善

学习

就餐卡系统第一周作业「架构师训练营第 1 期」

天天向善

学习

第一周总结

一个节点

极客大学架构师训练营

微服务 API 网关kong的爬坑之路

Dream

微服务网关 kong

演讲经验交流会|ArchSummit 上海站

演讲经验交流会|ArchSummit 上海站

James Ward谈使用HTML5和Java开发客户端/服务器应用-InfoQ