当前位置: 代码迷 >> Web前端 >> 新一代的Web表现层开发步骤(欢迎讨论)
  详细解决方案

新一代的Web表现层开发步骤(欢迎讨论)

热度:407   发布时间:2012-11-20 09:55:43.0
新一代的Web表现层开发方法(欢迎讨论)

??? 目前基于javaweb开发框架数不胜数,而且其核心的功能都集中在web表现层的开发上,在这里我不打算对这些框架进行详细的分析和评论(因为针对这些框架的评论文章已经很多了),而是从另外一个角度提出一个新的Web表现层开发方法。

Web开发的大都有这样的体会,页面与逻辑总是纠缠不清,没有一个清楚地界限。有一些开发方法虽然可以将程序逻辑与网页分离开来,但是却带来的另外的复杂性,不是需要借助特定的tag,就是需要创建附加的模板文件,目前还没有一种框架(我所见到的,也许已经有了),能够真正实现页面与程序逻辑的完全分类,只是将这种关系转移了而已。

我所要描述的这种新的Web表现层开发方法的灵感来自于ORM技术。对象/关系映射技术将java对象映射至数据库,由ORM框架自动完成数据的crud操作。同样的,我们也可以将java对象映射至html文档,由框架来完成html文档的填充,开发人员只需要操作普通的java对象,即可实现以前由脚本或者模版完成的工作。我将这种技术称为odm(对象/文档映射)。之所以称之为odm而不是ohm(对象/html映射),是因为这种技术还可以应用于更广泛的场景,比如,java对象到xml的映射,到wml的映射等。大家可能会认为这并不是真正的新的技术,其实很多使用taglib和模版的框架中都在使用这样的方法。但是我所要描述的方法与这些方法在实现上很大的不同,主要在以下几个方面:

1 Java对象属性与html文档中的节点通过java对象属性名和html中节点的ID属性对应.

? 使用这种方法保证了这种新的web开发方法不需要创建额外的模版,也不需要定义特定的taglib,最为主要的是将java对象,javascript脚本,css这几方统一命名,使得web开发的这几方面实现有机的统一,也使得这3个方面的相互操作成为可能。

2 程序开发人员所操作的只有java对象,没有任何的关于显示的循环、判断逻辑等。?

3 开发人员与美工完全可以独立的、并行的工作,不会出现垮领域操作。

<o:p>?</o:p>关于如何将java对象属性影射到html文档节点,这里面有一套完整但却不需要特别记忆的映射规则,以后再写。

这个框架完成后将具有以下主要特性:

1 基于POJO

2 事件驱动;

3 原生的AJAX;

4 容易与现有的基于POJO的持久化框架集成,且更方便。

5 真正的所见即所得的页面开发

6 搜索引擎友好

7 无需复杂的配置文件,甚至不需要配置文件即可工作;

8 支持组件式开发;

9 真正的代码与页面分离。

……

还有更多的特性,比如可以将java属性映射到cooki,或者session变量甚至application级变量等,可以最大限对的简化web开发中的方方面面,可以说这个框架在开发效率以及可维护性方面将超越目前的其他所有的框架(有点说大了~_~)

?? 系统中一个html页面,对应一个页面类,它们通过一个约定来对应,不需要配置。

整个系统的模型有点像Delphi,熟悉delphi的朋友可能比较熟悉,在开发delphi GUI程序时,一个窗口对应一个dfm文件,而代码则放在pas文件中,dfm文件中的内容描述了窗口的gui组件的位置、颜色等显示信息,pas文件中则是事件处理代码。在webpilot中,html页面文件相当于delphi中的dfm文件,页面java类相当于delphi中的pas文件,页面java类中的事件处理函数相当于delphipas文件中的事件处理过程。

????

今天就写这么多了,写的比较零散,请大家见谅。这个方法我已经考虑了两年多了,已经有一个完整的实现思路,也已经有一个可运行的实现。工作一直比较忙,工作也与java不沾边,而且发现现在变懒了(^_^)。不过我还是希望能够实现一个真正可用东西。

文笔不好,有些地方可能说的不太清楚,请原谅。有什么疑问请提出,欢迎大家讨论。

14 楼 dudo 2007-01-17  
billyu 写道
看了下,其实这个思想就是xmlc的思想封装吧,http://www.enhydra.org/ 实现的很好啊,只是用起来还是有些问题的。

忘了贴一个地址:

可以参看这个比较老一点的文章

http://www-128.ibm.com/developerworks/cn/linux/l-enhydra/index.html



完全不一样,不需要生成dom树,效率会高很多,而且更直观,就像操作持久类一样。
15 楼 amozon 2007-01-17  
感觉楼主想做的和zk有相似之处
16 楼 flyingbug 2007-01-17  
楼主说的是wicket吧?
17 楼 wxwdt 2007-01-18  
就是wicket就是这种思想!!!
18 楼 dudo 2007-01-18  
比wicket的开发更简单,目前看到的只有Tapestry 5有点类似,但是比Tapestry 5将更简单。


  这几天比较忙,本来要放一个例子上来,一回到家就忘记了,今天晚上贴一个例子,能更明白些。
19 楼 过河卒 2007-01-18  
期待实际的例子!学习中。。
20 楼 qy33 2007-01-18  
studying...
21 楼 JavaInActoin 2007-01-18  
楼主看一下JSF吧,不要瞎忙乎了
22 楼 SteveGY 2007-01-21  
<br/>
<strong>dudo 写道:</strong><br/>
<div class='quote_div'><font>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt;'><font size='3'><span style=''>??? 目前基于</span><span lang='EN-US'><font>java</font></span><span style=''>的</span><span lang='EN-US'><font>web</font></span><span style=''>开发框架数不胜数,而且其核心的功能都集中在</span><span lang='EN-US'><font>web</font></span><span style=''>表现层的开发上,在这里我不打算对这些框架进行详细的分析和评论</span><span lang='EN-US'><font>(</font></span><span style=''>因为针对这些框架的评论文章已经很多了</span><span lang='EN-US'><font>)</font></span><span style=''>,而是从另外一个角度提出一个新的</span><span lang='EN-US'><font>Web</font></span><span style=''>表现层开发方法。</span></font></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt;'><font size='3'><span style=''/></font></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt; text-indent: 21.75pt;'><font size='3'><span style=''>作</span><span lang='EN-US'><font>Web</font></span><span style=''>开发的大都有这样的体会,页面与逻辑总是纠缠不清,没有一个清楚地界限。有一些开发方法虽然可以将程序逻辑与网页分离开来,但是却带来的另外的复杂性,不是需要借助特定的</span><span lang='EN-US'><font>tag,</font></span><span style=''>就是需要创建附加的模板文件,目前还没有一种框架</span><span lang='EN-US'><font>(</font></span><span style=''>我所见到的,也许已经有了</span><span lang='EN-US'><font>)</font></span><span style=''>,能够真正实现页面与程序逻辑的完全分类,只是将这种关系转移了而已。</span></font></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt; text-indent: 21.75pt;'><font size='3'><span style=''/></font></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt; text-indent: 21.75pt;'><font size='3'><span style=''>我所要描述的这种新的</span><span lang='EN-US'><font>Web</font></span><span style=''>表现层开发方法的灵感来自于</span><span lang='EN-US'><font>ORM</font></span><span style=''>技术。对象</span><span lang='EN-US'><font>/</font></span><span style=''>关系映射技术将</span><span lang='EN-US'><font>java</font></span><span style=''>对象映射至数据库,由</span><span lang='EN-US'><font>ORM</font></span><span style=''>框架自动完成数据的</span><span lang='EN-US'><font>crud</font></span><span style=''>操作。同样的,我们也可以将</span><span lang='EN-US'><font>java</font></span><span style=''>对象映射至</span><span lang='EN-US'><font>html</font></span><span style=''>文档,由框架来完成</span><span lang='EN-US'><font>html</font></span><span style=''>文档的填充,开发人员只需要操作普通的</span><span lang='EN-US'><font>java</font></span><span style=''>对象,即可实现以前由脚本或者模版完成的工作。我将这种技术称为</span><span lang='EN-US'><font>odm(</font></span><span style=''>对象</span><span lang='EN-US'><font>/</font></span><span style=''>文档映射</span><span lang='EN-US'><font>)</font></span><span style=''>。之所以称之为</span><span lang='EN-US'><font>odm</font></span><span style=''>而不是</span><span lang='EN-US'><font>ohm(</font></span><span style=''>对象</span><span lang='EN-US'><font>/html</font></span><span style=''>映射</span><span lang='EN-US'><font>)</font></span><span style=''>,是因为这种技术还可以应用于更广泛的场景,比如</span><span lang='EN-US'><font>,java</font></span><span style=''>对象到</span><span lang='EN-US'><font>xml</font></span><span style=''>的映射,到</span><span lang='EN-US'><font>wml</font></span><span style=''>的映射等。大家可能会认为这并不是真正的新的技术,其实很多使用</span><span lang='EN-US'><font>taglib</font></span><span style=''>和模版的框架中都在使用这样的方法。但是我所要描述的方法与这些方法在实现上很大的不同,主要在以下几个方面:</span></font></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt; text-indent: 21.75pt;'><font size='3'><span style=''/></font></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt 32.25pt; text-indent: -10.5pt;'><font size='3'><span lang='EN-US'><font>1 Java</font></span><span style=''>对象属性与</span><span lang='EN-US'><font>html</font></span><span style=''>文档中的节点通过</span><span lang='EN-US'><font>java</font></span><span style=''>对象属性名和</span><span lang='EN-US'><font>html</font></span><span style=''>中节点的</span><span lang='EN-US'><font>ID</font></span><span style=''>属性对应</span><span lang='EN-US'><font>.</font></span></font></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt 32.25pt; text-indent: -10.5pt;'><font size='3'><span lang='EN-US'><span style=''><font>? </font></span></span><span style=''>使用这种方法保证了这种新的</span><span lang='EN-US'><font>web</font></span><span style=''>开发方法不需要创建额外的模版,也不需要定义特定的</span><span lang='EN-US'><font>taglib</font></span><span style=''>,最为主要的是将</span><span lang='EN-US'><font>java</font></span><span style=''>对象</span><span lang='EN-US'><font>,javascript</font></span><span style=''>脚本,</span><span lang='EN-US'><font>css</font></span><span style=''>这几方统一命名,使得</span><span lang='EN-US'><font>web</font></span><span style=''>开发的这几方面实现有机的统一,也使得这</span><span lang='EN-US'><font>3</font></span><span style=''>个方面的相互操作成为可能。</span></font></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt; text-indent: 21.75pt;'><span lang='EN-US'><span style=''><font size='3'/></span></span></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt 32.25pt; text-indent: -10.5pt;'><font size='3'><span lang='EN-US'><font>2 </font></span><span style=''>程序开发人员所操作的只有</span><span lang='EN-US'><font>java</font></span><span style=''>对象,没有任何的关于显示的循环、判断逻辑等。</span></font><span lang='EN-US'><span style=''><font size='3'>?</font></span></span></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt; text-indent: 21.75pt;'><font size='3'><span lang='EN-US'><font>3 </font></span><span style=''>开发人员与美工完全可以独立的、并行的工作,不会出现垮领域操作。</span></font></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt; text-indent: 21.75pt;'><span lang='EN-US'>&lt;o:p&gt;<font size='3'>?</font>&lt;/o:p&gt;</span><font size='3'><span style=''>关于如何将</span><span lang='EN-US'><font>java</font></span><span style=''>对象属性影射到</span><span lang='EN-US'><font>html</font></span><span style=''>文档节点,这里面有一套完整但却不需要特别记忆的映射规则,以后再写。</span></font></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt; text-indent: 0.75pt;'><span style=''><font size='3'>这个框架完成后将具有以下主要特性:</font></span></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt; text-indent: 0.75pt;'><span style=''><font size='3'/></span></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt; text-indent: 21.75pt;'><font size='3'><span lang='EN-US'><font>1 </font></span><span style=''>基于</span><span lang='EN-US'><font>POJO</font></span><span style=''>;</span></font></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt; text-indent: 21.75pt;'><font size='3'><span lang='EN-US'><font>2 </font></span><span style=''>事件驱动;</span></font></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt; text-indent: 21.75pt;'><font size='3'><span lang='EN-US'><font>3 </font></span><span style=''>原生的</span><span lang='EN-US'><font>AJAX;</font></span></font></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt; text-indent: 21.75pt;'><font size='3'><span lang='EN-US'><font>4 </font></span><span style=''>容易与现有的基于</span><span lang='EN-US'><font>POJO</font></span><span style=''>的持久化框架集成,且更方便。</span></font></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt; text-indent: 21.75pt;'><font size='3'><span lang='EN-US'><font>5 </font></span><span style=''>真正的所见即所得的页面开发</span></font></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt; text-indent: 21.75pt;'><font size='3'><span lang='EN-US'><font>6 </font></span><span style=''>搜索引擎友好</span></font></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt; text-indent: 21.75pt;'><font size='3'><span lang='EN-US'><font>7 </font></span><span style=''>无需复杂的配置文件,甚至不需要配置文件即可工作;</span></font></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt; text-indent: 21.75pt;'><font size='3'><span lang='EN-US'><font>8 </font></span><span style=''>支持组件式开发;</span></font></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt; text-indent: 21.75pt;'><font size='3'><span lang='EN-US'><font>9 </font></span><span style=''>真正的代码与页面分离。</span></font></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt; text-indent: 21.75pt;'><span lang='EN-US'><font size='3'>……</font></span></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt; text-indent: 21.75pt;'><span lang='EN-US'><font size='3'/></span></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt; text-indent: 21.75pt;'><font size='3'><span style=''>还有更多的特性,比如可以将</span><span lang='EN-US'><font>java</font></span><span style=''>属性映射到</span><span lang='EN-US'><font>cooki,</font></span><span style=''>或者</span><span lang='EN-US'><font>session</font></span><span style=''>变量甚至</span><span lang='EN-US'><font>application</font></span><span style=''>级变量等,可以最大限对的简化</span><span lang='EN-US'><font>web</font></span><span style=''>开发中的方方面面,可以说这个框架在开发效率以及可维护性方面将超越目前的其他所有的框架</span><span lang='EN-US'><font>(</font></span><span style=''>有点说大了</span><span lang='EN-US'><font>~_~)</font></span><span style=''>。</span></font></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt; text-indent: 21.75pt;'><font size='3'><span style=''/></font></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt 21pt; text-indent: 0.75pt;'><font size='3'><span lang='EN-US'><span style=''><font>?? </font></span></span><span style=''>系统中一个</span><span lang='EN-US'><font>html</font></span><span style=''>页面,对应一个页面类,它们通过一个约定来对应,不需要配置。</span></font></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt 21pt; text-indent: 21.75pt;'><font size='3'><span style=''>整个系统的模型有点像</span><span lang='EN-US'><font>Delphi</font></span><span style=''>,熟悉</span><span lang='EN-US'><font>delphi</font></span><span style=''>的朋友可能比较熟悉,在开发</span><span lang='EN-US'><font>delphi GUI</font></span><span style=''>程序时,一个窗口对应一个</span><span lang='EN-US'><font>dfm</font></span><span style=''>文件</span><span lang='EN-US'><font>,</font></span><span style=''>而代码则放在</span><span lang='EN-US'><font>pas</font></span><span style=''>文件中,</span><span lang='EN-US'><font>dfm</font></span><span style=''>文件中的内容描述了窗口的</span><span lang='EN-US'><font>gui</font></span><span style=''>组件的位置、颜色等显示信息,</span><span lang='EN-US'><font>pas</font></span><span style=''>文件中则是事件处理代码。在</span><span lang='EN-US'><font>webpilot</font></span><span style=''>中,</span><span lang='EN-US'><font>html</font></span><span style=''>页面文件相当于</span><span lang='EN-US'><font>delphi</font></span><span style=''>中的</span><span lang='EN-US'><font>dfm</font></span><span style=''>文件,页面</span><span lang='EN-US'><font>java</font></span><span style=''>类相当于</span><span lang='EN-US'><font>delphi</font></span><span style=''>中的</span><span lang='EN-US'><font>pas</font></span><span style=''>文件,页面</span><span lang='EN-US'><font>java</font></span><span style=''>类中的事件处理函数相当于</span><span lang='EN-US'><font>delphi</font></span><span style=''>中</span><span lang='EN-US'><font>pas</font></span><span style=''>文件中的事件处理过程。</span></font></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt 21pt; text-indent: 0.75pt;'><span lang='EN-US'><span style=''><font size='3'>???? </font></span></span></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt 21pt; text-indent: 0.75pt;'><font size='3'><span style=''>今天就写这么多了,写的比较零散,请大家见谅。这个方法我已经考虑了两年多了,已经有一个完整的实现思路,也已经有一个可运行的实现。工作一直比较忙,工作也与</span><span lang='EN-US'><font>java</font></span><span style=''>不沾边,而且发现现在变懒了</span><span lang='EN-US'><font>(^_^)</font></span><span style=''>。不过我还是希望能够实现一个真正可用东西。</span></font></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt 21pt; text-indent: 0.75pt;'><font size='3'><span style=''/></font></p>
<p class='MsoNormal' style='margin: 0cm 0cm 0pt 21pt; text-indent: 11.25pt;'><span style=''><font size='3'>文笔不好,有些地方可能说的不太清楚,请原谅。有什么疑问请提出,欢迎大家讨论。</font></span></p>
</font></div>
<br/>
<br/>
<br/>
<br/>
<div style='margin: 0cm 0cm 0pt 21pt; text-indent: 0.75pt;'><strong>“词汇疲劳”。</strong>楼主已经写了一堆似是而非的东西,唯一看的出来的是,楼主曾经是delphi的开发人员,并且试图以过去的经验来解决java web开发过程中遇到的一些问题。有这样的想法也无可非议,但,目前世界上真正实现了这一堆功能的,只有ASP.NET,在具有强大的IDE的支持下,这样的一种implementation才可以称为是effective的。甚至JSF,离这一目标还有很遥远的距离。</div>
<div style='margin: 0cm 0cm 0pt 21pt; text-indent: 0.75pt;'>我不常来这里,我也没有评分的爱好,不过要是我可以评分的话,我投票是“新手帖”</div>
23 楼 giscat 2007-01-22  
表现层真是越来越重要了,
以前一直搞服务器端,对客户端的东西不屑一顾,
现在大有长进,有时还能够帮美工MM做做美工,
N多难缠问题拿到客户端处理,相当之简洁完美方便
  相关解决方案