前一篇文章分析了Java平台下不同类型WEB框架对开发模式的影响，多数Java领域的WEB框架都是聚焦于服务端MVC的实现，这些框架对View的支持，通常是基于标准的JSP或类似JSP的模板技术如Freemarker或Velocity。JSP或类JSP的模板技术已经是上个世纪的页面技术了，它能跟上时代的发展和技术的进步吗？

我们先看一段典型的JSP页面代码（摘自Struts2样例代码）：

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"

    pageEncoding="ISO-8859-1"%>

<%@ taglib prefix="s" uri="/struts-tags" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">

<title>Hello World!</title>

</head>

<body>

<h2><s:property value="messageStore.message" /></h2>

<p>I've said hello <s:property value="helloCount" /> times!</p>

<p><s:property value="messageStore" /></p>

</body>

</html>

再看一段Android平台下UI开发的代码（摘自Android开发手册）：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:layout_width="fill_parent" 
              android:layout_height="fill_parent"
              android:orientation="vertical" >
    <TextView android:id="@+id/text"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:text="I am a TextView" />
    <Button android:id="@+id/button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="I am a Button" />
</LinearLayout>

还可以看看Flex UI代码（摘自Flex开发手册）：

<?xml version="1.0"?>

<!-- containers\layouts\VBoxSimple.mxml -->

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">

    <mx:VBox borderStyle="solid"

        paddingTop="10"

        paddingBottom="10"

        paddingLeft="10"

        paddingRight="10">

        <mx:Button id="fname" label="Button 1"/>

        <mx:Button id="lname" label="Button 2"/>

        <mx:Button id="addr1" label="Button 3"/>

        <mx:ComboBox id="state">

              <mx:ArrayCollection>

                 <mx:String>ComboBox 1</mx:String>

              </mx:ArrayCollection>

        </mx:ComboBox>

    </mx:VBox>

</mx:Application>

对比上面三段代码，可以看出JSP页面技术与Android及Flex UI技术的差异：

  • 命令式 vs. 声明式：JSP是命令式代码编写方式，而Android及Flex是声明式；
  • 组件化：JSP代码的组件能力很差，主要通过标签库tag lib实现展现逻辑的利用，而Android及Flex都有专门设计的组件机制；
  • 布局支持：JSP对页面展示的布局没有支持，Android及Flex都有大量的布局组件实现声明式布局；
  • 数据组件：JSP没有支持，Android有ContentProvider抽象，Flex则有各种数据对象，用于存取本地或远程数据

声明式和组件化应该是必然的趋势，由此可见JSP技术的落后。但遗憾的是目前Java平台还没有什么技术可以取代JSP：JSF是基于JSP的新一代页面技术，但从设计上看JSF相比Android和Flex还较大差距；GWT之类的框架也可以取代JSP，但GWT走向了纯命令式的相反方向。

如果向Android和Flex的开发模式看齐，基于Java平台开发WEB应用的最佳方式应该是HTML+JS+JSON。HTML也是声明式的，本质上和前面Android及Flex的UI技术类似；JS相当于Android中的Java及Flex中的ActionScript，JSON用于客户端与服务端进行数据交换。只是HTML+JS+JSON也有其不足之处：

  • HTML内建组件(tag)相比Flex及Android的组件，其表现力不够，比如HTML没有布局组件，HTML的table相比Flex的DataGrid组件过于低层；
  • HTML本身的设计并非是用于UI，比如其没有考虑数据绑定机制，也没有数据组件之类的概念；
  • HTML没有组件定制能力，而Android及Flex都设计了自定义组件的机制；

由于存在以上不足，就出现了EasyUI/DWZ等声明式的UI框架，这也是WEB开发模式浅析中建议采用EasyUI/DWZ等框架的理由。

回到Java世界，是否可以在服务端设计一种声明式、组件化的页面技术用于取代传统JSP页面技术呢？

UI开发模式对比：JSP、Android、Flex的更多相关文章

  1. UI开发模式－容器模式

    UI开发模式-容器模式 通用容器: 配置容器.

  2. IOS 与ANDROID框架及应用开发模式对比一

    IOS 和ANDROID操作系统都是目前流行的移动操作系统,被移动终端和智能设备大量采用,两者都采用了先进的软件技术进行设计,为了方便应用开发两者都采用了先进的设计模式.两者在框架设计上都采用了什么技 ...

  3. Hybrid App—Hybrid App开发模式介绍和各种开发模式对比

    什么是Hybrid App 最开的App开发只有原生开发这个概念,但自从H5广泛流行后,一种效率更高的开发模式Hybrid应运而生,它就是"Hybrid模式".Hybrid APP ...

  4. Hybrid App开发模式中, IOS/Android 和 JavaScript相互调用方式

    IOS:Objective-C 和 JavaScript 的相互调用 iOS7以前,iOS SDK 并没有原生提供 js 调用 native 代码的 API.但是 UIWebView 的一个 dele ...

  5. Android UI开发神兵利器之Android Action Bar Style Generator

    版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/x359981514/article/details/26283129 ActionBar是3.0后的 ...

  6. Android UI开发神兵利器之Android Asset Studio

    Android Asset Studio 这个工具提供了一系列的资源设计实现,很推荐:

  7. Android UI开发第三十篇——使用Fragment构建灵活的桌面

    http://www.lupaworld.com/article-222973-1.html 当我们设计应用程序时,希望能够尽最大限度的适配各种设备,包括4寸屏.7寸屏. 10寸屏等等,Android ...

  8. JSP内置标签 JSP中JavaBean标签 JSP开发模式 EL和JSTL快速入门

    2 JSP内置标签(美化+业务逻辑)   1)为了取代<%%>脚本形式,使用JSP标签/JSP动作,目的:与JSP页面的美化,即JSP面页都是由标签组成,不再有其它的内容   2)JSP内 ...

  9. JSP运行过程 JSP脚本 静态动态包含 jsp指令 jsp内置对象jsp四大作用域 jsp动作元素 EL表达式 JSTL 设计模式 JSP开发模式 EL内置对象

    Day38 JSP JSP的运行过程具体如下: (1)客户端发出请求,请求访问JSP文件. (2)JSP容器先将JSP文件转换成一个Java源文件(Java Servlet源程序),在转换过程中,如果 ...

随机推荐

  1. mybatis表关联彻底理解

    1.多张表关联 三张表,用户表,主播表,关注表. 查询用户已经关注的主播的信息,那就要三张表关联起来啊.分别left join联在一起,通过id相同的连接在一起.最后where查找出最终条件. < ...

  2. 线程调度策略SCHED_RR（轮转法）和SCHED_FIFO（先进先出）之对照

    我们在用pthread创建线程时,能够指定调度策略policy--SCHED_OTHER(默认).SCHED_RR和SCHED_FIFO.这里TALK一下两个实时策略--SCHED_RR和SCHED_ ...

  3. C#中类的详解

    类定义的具体语法形式类的访问修饰符 修饰符 类名{ 类的成员} 类的访问修饰符:用于设定对类的访问权限,包括public.internal或者不写,用internal或者不写时代表只能在当前项目中访问 ...

  4. CSS中的BFC解析

    CSS的BFC BFC 即块级格式上下文(Block Formatting Context),它是指一个独立的块级渲染区域,只有block-level的box参与,该区域拥有一套渲染规则来约束块级盒子 ...

  5. C# 文件里的类不能进行设计，因此未能为该文件显示设计器

    C# 文件里的类不能进行设计,因此未能为该文件显示设计器 vs 一直打不开设计界面  仅仅能查看代码界面  这时候须要查看  代码中  是不是 从 form    继承 假设不是 窗口类型 改为 fo ...

  6. install yael on the ubuntu 12.04

    1. bits/predefs.h no such file or directory  ??? sudo apt-get install gcc-multilib 2. sudo gedit /et ...

  7. 通过已有Nginx镜像创建私有仓库

    想搭建一个私有的Docker仓库,查看了各种资料,大多是使用Nginx做代理.但是因为对于Nginx不熟悉,各种关于权限认证的问题,折腾了两天也没有搞定.后来无意在网上看到一篇使用已有镜像的方法,最终 ...

  8. Expressions-->Member lookup

    7.4 Member lookup 在word文档的第140页 A member lookup is the process whereby凭借:通过…:借以:与…一致 the meaning of ...

  9. MSP430:AD10

    使用的MSP430G2553,为AD10,正常有8路输出,P1.0-P1.7为A0-A7 有七个寄存器, 参考电压可以是VCC或者内部参考电压1.5V或者2.5V 参考时钟可以是内部ADC10OSC ...

  10. 红黑树插入操作原理及java实现

    红黑树是一种二叉平衡查找树,每个结点上有一个存储位来表示结点的颜色,可以是RED或BLACK.红黑树具有以下性质: (1) 每个结点是红色或是黑色 (2) 根结点是黑色的 (3) 如果一个结点是红色的 ...