谈到应用开发,不管是客户端 / 服务器类应用、传统的 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 框架时,你需要关注以下三个方面:
- 这一 Web 框架是不是对构建客户端和服务器都有帮助?现代 Web 框架通常会提供“Asset Compilers”或“Asset Pipelines”,辅助开发者编写 JavaScript、CoffeeScript 和 LESS。例如,Play Framework 所带的 Asset Compiler,将服务端代码(Java 或 Scala)和客户端代码(JavaScript、CoffeeScript 和 LESS)的编写体验统一起来。
- 能否像管理服务端依赖一样管理客户端依赖?越来越多的代码正在移向客户端(JavaScript 和 CSS 等)。这意味着 jQuery、Bootstrap 和 Backbone 等客户端库的使用也会越来越多。因此,我们需要像管理服务端依赖一样管理客户端依赖(及其传递依赖)。我创建了“WebJars”项目(www.webjars.org),把常见的客户端库打包成 Jar 文件,这样就可以将其包含到 Maven(或其他构建工具)依赖列表中了。
- 创建 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 层使如下四个方面得以简化:
- Web 层不包含状态时,水平伸缩很容易。这使 Web 层可以独立并即时地伸缩。
- 在无状态的 Web 层中,持续交付也更容易了,因为部署新版本时无需担心会话状态。
- RESTful 服务应该是无状态的。每个请求都是原子的,不依赖于前面的任何请求。
- 不管是采用自动化测试(如单元测试或功能测试),还是开发者在其浏览器中通过点击刷新的方式测试新代码,无状态 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
评论