Freemarker网页静态化技术的学习

最新推荐文章于 2023-01-17 23:27:42 发布

程序逸

最新推荐文章于 2023-01-17 23:27:42 发布

阅读量132

点赞数

分类专栏：前端框架学习文章标签： freemarker

本文链接：https://blog.csdn.net/qq_43265564/article/details/115308812

版权

前端框架学习专栏收录该内容

10 篇文章 0 订阅

订阅专栏

本文介绍了网页静态化技术如何应用于大规模电商网站，以减轻数据库压力。通过FreeMarker模板引擎的实例，展示了如何创建和处理模板文件，实现动态数据的填充。讲解了FTL指令如assign、include、if-else、list等，并演示了如何使用FreeMarker生成静态HTML页面。此外，还讨论了Nginx在静态页面部署中的高效性能。

摘要由CSDN通过智能技术生成

什么是网页静态化技术：

对于电商网站的商品详细页来说，至少几百万个商品，每个商品又有大量的信息，这样的情况同样也适用于使用网页静态化来解决。
网页静态化技术和缓存技术的共同点都是为了减轻数据库的访问压力，但是具体的应用场景不同，缓存比较适合小规模的数据，而网页静态化比较适合大规模且相对变化不太频繁的数据。
另外我们如果将网页以纯静态化的形式展现，就可以使用Nginx这样的高性能的web服务器来部署。Nginx可以承载5万的并发，而Tomcat只有几百。

定义：FreeMarker 是一个用 Java 语言编写的模板引擎，它基于模板来生成文本输出。
我们可以通过定义模板来把固定不变或者变化很少的部分定义好，其他需要变化的数据可以通过获取数据来进行填充显示

写一个入门小案例感受一下：

创建maven项目，导入依赖：

<dependency>		
<groupId>org.freemarker</groupId>
<artifactId>freemarker</artifactId>
<version>2.3.23</version>
</dependency>

开始创建模板，这里我们模拟网站，我们不变的地方是评价，比如这东西真的很好，变的是商品的种类名称，这里创建的模板文件有四种属性：

名称	作用
文本	就是纯文字
<#–…-->	注释，网页不会输出
${…}	插值（Interpolation）使用数据模型中的部分替代输出
FTL指令	FreeMarker指令，和HTML标记类似

OK，在resources文件下创建test.ftl文件
在这里插入图片描述

<html>
<head>
    <meta charset="utf-8">
    <title>Freemarker入门小DEMO </title>
</head>
<body>
<#--我只是一个注释，我不会有任何输出  -->
${name}
评价：非常好，顶呱呱
${message}
</body>
</html>

这里写一个demo类来生成数据：

public class demo {
    public static void main(String[] args) throws IOException, TemplateException {
        Configuration configuration = new Configuration(Configuration.getVersion());
        configuration.setDirectoryForTemplateLoading(new File("D:\\IntellijIDEA\\freemarkerdemo\\src\\main\\resources"));
        configuration.setDefaultEncoding("utf-8");
        Template template = configuration.getTemplate("test.ftl");
        Map map=new HashMap();
        map.put("name", "华为P30");
        map.put("message", "3999元");
        FileWriter out = new FileWriter(new File("D:\\IntellijIDEA\\freemarkerdemo\\src\\main\\resources\\demo.html"));
        template.process(map,out);
        out.close();
    }
}

运行main方法，点击打开生成的demo.html文件看看效果。

可以看到，我们在模板里面定义的 $ {name}和 $ {message}被替换成了我们需要变化的数据

对于模板文件，有FTL指令：

assign:此指令用于在页面上定义一个变量或者对象：

<html>
<#assign name2="华为P30pro">
<#assign name3={"name":"华为P40","price":"6666"}>
<head>
    <meta charset="utf-8">
    <title>Freemarker入门小DEMO </title>
</head>
<body>

<#--我只是一个注释，我不会有任何输出  -->
${name}
评价：非常好，顶呱呱
${message}
豪华版：${name2}
升级版：${name3.name}
价格：${name3.price}
</body>
</html>

修改模板，重新运行主函数，重新生成静态页面。
在这里插入图片描述

include指令，此指令用于模板文件的嵌套
if-else指令：在demo主函数中给success赋值

在这里插入图片描述

list指令，用于循环遍历数组集合

<!--这里goodsList是需要遍历的集合，goods是一个中间变量代表每一次遍历的数据对象-->
<#list goodsList as goods>  
${goods_index+1} 商品名称： ${goods.name} 价格：${goods.price}<br>
</#list>

FTL还有内置函数，内建函数语法格式：变量?函数名称

获取集合大小：

${goodsList?size}

转换字符串为JSON对象

 <#assign text="{'bank':'工商银行','account':'18901920201920212'}" />
 <#assign data=text?eval />	
 开户行：${data.bank}  账号：${data.account}

日期格式化，在demo主方法中增加time变量

当前日期：${today?date} <br>
当前时间：${today?time} <br>
当前日期+时间：${today?datetime} <br>
日期格式化：  ${today?string("yyyy年MM月")}

在这里插入图片描述

数字转换为字符串，当我们传入的数字会以英式格式显示，就是每三位数一个顿号分割，我们可以使用让其变为字符串

${point?c}

判断某变量是否存在:“??”，如果该变量存在,返回true,否则返回false

<#if aaa??>
  aaa变量存在
<#else>  
aaa变量不存在
</#if>

变量默认值:“!”，我们除了可以判断是否为空值，也可以使用!对null值做转换处理

${aaa!'-'}
<!--在代码中不对aaa赋值，也不会报错了 ，当aaa为null则返回！后边的内容-->

程序逸

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录