Spring MVC视图层:thymeleaf vs. JSP

本文对比了同一Spring MVC工程中相同页面(一个订阅表单)分别采用Thymeleaf和JSP(包括JSP、JSTL、Spring tag lib)两种方式的实现。

本文的所有代码来自一个可运行的应用。你可以从文档页面下载该应用程序的源代码。

Common requirements

顾客通过一个表单添加到消息列表中,包含下面两个域:

  • Email地址
  • 订阅类型(接收所有邮件、每日摘要)

要求该页面支持HTML5且完全国际化,国际化信息从Spring框架中配置的MessageSource对象中抽取所有的文本和消息。

该应用包含两个@Controller,二者含有相同的代码,只是跳转到不同的view:

  • SubscribeJsp用于JSP页面(subscribejsp视图)
  • SubscribeTh用于Thymeleaf页面(subscribeth视图)

在模型(model)中包含下列类:

  • Subscription:form-backing bean,包含两个域:String email和SubscriptionType subscriptionType。
  • SubscriptionType:一个枚举类型,表单中subscriptionType域的值,可取的值包含ALL_EMAILS和DAILY_DIGEST。

(本文我们仅关注JSP和Thymeleaf模板代码的讨论。如果你想了解controller代码和Spring配置的实现细节,请自行查看下载包中的源代码)

使用JSP实现(Doing it with JSP)

这是页面:

Spring MVC视图层:thymeleaf vs. JSP

下面是JSP代码,使用了JSTL(core)和Spring(tags和form) JSP标签库:

<%@ taglib prefix="sf" uri="http://www.springframework.org/tags/form" %><%@
taglib prefix="s" uri="http://www.springframework.org/tags" %><%@
taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %><%@
page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%><!DOCTYPE html> <html> <head>
<title>Spring MVC view layer: Thymeleaf vs. JSP</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" type="text/css" media="all" href="<s:url value='/css/thvsjsp.css' />"/>
</head> <body> <h2>This is a JSP</h2> <s:url var="formUrl" value="/subscribejsp" />
<sf:form modelAttribute="subscription" action="${formUrl}"> <fieldset> <div>
<label for="email"><s:message code="subscription.email" />: </label>
<sf:input path="email" />
</div>
<div>
<label><s:message code="subscription.type" />: </label>
<ul>
<c:forEach var="type" items="${allTypes}" varStatus="typeStatus">
<li>
<sf:radiobutton path="subscriptionType" value="${type}" />
<label for="subscriptionType${typeStatus.count}">
<s:message code="subscriptionType.${type}" />
</label>
</li>
</c:forEach>
</ul>
</div> <div class="submit">
<button type="submit" name="save"><s:message code="subscription.submit" /></button>
</div> </fieldset> </sf:form> </body> </html>
上一篇:Dubbo使用详解及环境搭建


下一篇:linux+windows mysql导入导出sql文件