IntelliJ+SpringBoot项目实战(28)--整合Beetl模板框架

在前面的文章里介绍过freemarker,thymeleaf模板引擎,本文介绍另一个性能超高的模板引擎---Beetl,据说此模板引擎的性能远超Freemarker。官网的说法是,Beetl 远超过主流java模板引擎性能(引擎性能5-6倍于FreeMarker,2倍于JSP。参考附录),而且消耗较低的CPU。

官方网站是:

DocumentDescriptionhttp://ibeetl.com/guide/#/beetl 这个网站上有详细的示例。想深入学习的话可在此网站上下载资料。

那么为什么有时候我们需要考虑使用模板引擎呢?使用VUE做前后端分离的前端不可以吗?使用模板引擎的主要场景是内容类网站,希望HTML正文能够对爬虫友好的,或者说内容能够直接呈现在html元素中,而不是通过接口动态赋值给页面元素的。

本文介绍Beetl快速上手的过程。

一、引入依赖

在openjweb-core模块中引入beetl依赖

XML 复制代码
    <dependency>
         <groupId>com.ibeetl</groupId>
         <artifactId>beetl-framework-starter</artifactId>
         <version>1.2.28.RELEASE</version>
    </dependency>

二、开发测试类

在openjweb-sys工程中建一个BeetlDemoController.java:

java 复制代码
package org.openjweb.sys.controller;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;

import java.util.HashMap;
import java.util.Map;

/**
 * http://localhost:8001/demo/beetl/queryBook
 */
@Controller
@RequestMapping(value="/demo/beetl/")
public class BeetlDemoController {

    @RequestMapping(value="/queryBook")

    public String queryBook( Model model) {


        Map<String,Object> map = new HashMap();
        map.put("name", "三国演义");
        map.put("author", "罗贯中");

        model.addAttribute("book", map);
        return "beetlDemo.btl";//返回页面名
    }
}

这段代码创建了一个Map,map中含name,author,然后设置给book变量返回给前端的beetlDemo.btl页面。

然后在openjweb-sys的resources/templates下建一个beetlDemo.btl文件:

html 复制代码
<!DOCTYPE HTML>
<html>
<head>
    <title>图书</title>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>

</head>

<body>
<table border="1">
    <tr>
        <td>book</td>
        <td>author</td>
    </tr>

    <tr>
        <td>${book.name}</td>
        <td>${book.author}</td>
    </tr>
</table>
</body>
</html>

文件中使用了{book.name}和{book.author}两个变量。

运行http://localhost:8001/demo/beetl/queryBook

但是在实际项目中,如果把前端制作好的.html文件再改成扩展名.btl的话,会耗费时间,另外也不利于实时查看页面展示效果。所以还是使用.html后缀比较方便一点。如果使用.html后缀,可在application-dev.yml中增加:

复制代码
beetl:
  suffix: html

注意不是在spring节点下增加的,后缀html也不带. 别写成.html ,这个是实测过的。改成html后缀后,上面的beetlDemoController.java中的return "beetlDemo.btl" ;改为return "beetlDemo.html" ;即可。注意如果去掉.html会解析失败,所以需要写完整的文件名。改为解析.html后,.btl的解析就不支持了。

经过测试,beetl改为解析.html后,并不影响thymeleaf解析前面章节示例中的页面。另外以后项目主要还是使用beetl作为模板引擎。

二、beetl基础语法

如果完整学习beetl基础语法可查看官方资料:DocumentDescriptionhttp://ibeetl.com/guide/#/beetl/all 这里介绍常用的语法,beetl的语法有点类似javascript,也有点类似jsp,可以使用<%%>来书写beetl脚本。我们创建一个测试html,命名为beetlDemo3.html:

html 复制代码
<!DOCTYPE HTML>
<html>
<head>
    <title>图书2</title>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>

</head>

<body>


<%
var a = 2;
var b = 3;
var result = a+b;
%>
hello 2+3=${result}<p>

    <!--rotate-->
    <%
    for(user in users){
    %>
    hello,${user.realName},your email is ${user.userEmail} ;
    <% } %>

</body>
</html>

然后在控制层中再增加一个测试方法,这个测试方法返回用户列表,然后在前端展示:

java 复制代码
//http://localhost:8001/demo/beetl/demo

    /**
     * 演示beetl语法
     * @param model
     * @return
     */
    @RequestMapping(value="/demo")

    public String demo( Model model) {

        CommUser user = new CommUser();
        user.setRealName("张三");
        user.setUserEmail("abc@163.com");
        List<CommUser> list = new ArrayList<>();
        list.add(user );

        user = new CommUser();

        user.setRealName("李四");
        user.setUserEmail("lisi@163.com");
        list.add(user );


        model.addAttribute("users", list);
        return "beetlDemo3.html";//返回页面名
    }

上面的代码创建了2个用户,放到users变量中返回给beetleDemo3.html,在beetleDemo3.html中,使用

html 复制代码
  <%
    for(user in users){
    %>
    hello,${user.realName},your email is ${user.userEmail} ;
    <% } %>

循环显示users中的realName和userEmail,运行效果:

另外

<%

var a = 2;

var b = 3;

var result = a+b;

%>

复制代码
hello 2+3=${result}<p>

演示了在html中书写动态脚本,有点类似jsp和javascript。

另外我们还可以使用beetl的逻辑表达式if,在beetlDemo3.html的</body>前加上下面的代码:

html 复制代码
   <%
    var aa = 1;
    var bb="good";
    var cc = null;

    if(aa==1&&bb=="good"&&cc==null){
     %>
    <script>alert('符合条件')</script>
    <%
    }
    else{%>
    <script>alert('不符合条件')</script>

    <%
    }
    %>

运行效果:

还有其他常用的语法,下面是for的表达式:

<% var a = [1,2,3]; for(var i=0;i<a.~size;i++){ print(a[i]); } %>

下面是while循环:

<% var i = 0; while(i<5){ print(i); i++; } %>

其他语法就不再一一列举了。大家可以在使用的过程中根据需要来学习更多的语法。

本例代码见github:

GitHub - openjweb/cloud at masterOpenJWeb is a java bases low code platform. Contribute to openjweb/cloud development by creating an account on GitHub.https://github.com/openjweb/cloud/tree/master

相关推荐
一只叫煤球的猫1 小时前
写代码很6,面试秒变菜鸟?不卖课,面试官视角走心探讨
前端·后端·面试
bobz9651 小时前
tcp/ip 中的多路复用
后端
bobz9652 小时前
tls ingress 简单记录
后端
皮皮林5513 小时前
IDEA 源码阅读利器,你居然还不会?
java·intellij idea
你的人类朋友3 小时前
什么是OpenSSL
后端·安全·程序员
bobz9653 小时前
mcp 直接操作浏览器
后端
前端小张同学5 小时前
服务器部署 gitlab 占用空间太大怎么办,优化思路。
后端
databook6 小时前
Manim实现闪光轨迹特效
后端·python·动效
武子康6 小时前
大数据-98 Spark 从 DStream 到 Structured Streaming:Spark 实时计算的演进
大数据·后端·spark
该用户已不存在7 小时前
6个值得收藏的.NET ORM 框架
前端·后端·.net