SpringBoot2 整合FreeMarker实现页面静态化示例详解
一、页面静态化
1、动静态页面
静态页面
即静态网页，指已经装载好内容HTML页面，无需经过请求服务器数据和编译过程，直接加载到客户浏览器上显示出来。通俗的说就是生成独立的HTML页面，且不与服务器进行数据交互。
优缺点描述：
- 静态网页的内容稳定，页面加载速度极快；
- 不与服务器交互，提升安全性；
- 静态网页的交互性差，数据实时性很低；
- 维度成本高，生成很多HTML页面；
动态页面
指跟静态网页相对的一种网页编程技术，页面的内容需要请求服务器获取，在不考虑缓存的情况下，服务接口的数据变化，页面加载的内容也会实时变化，显示的内容却是随着数据库操作的结果而动态改变的。
优缺点描述：
- 动态网页的实时获取数据，延迟性低；
- 依赖数据库交互，页面维护成本很低；
- 与数据库实时交互，安全控制的成本高；
- 页面加载速度十分依赖数据库和服务的性能；
动态页面和静态页面有很强的相对性，对比之下也比较好理解。
2、应用场景
动态页面静态化处理的应用场景非常多，例如：
- 大型网站的头部和底部，静态化之后统一加载；
- 媒体网站，内容经过渲染，直接转为HTML网页；
- 高并发下，CDN边缘节点代理的静态网页；
- 电商网站中，复杂的产品详情页处理；
静态化技术的根本：提示服务的响应速度，或者说使响应节点提前，如一般的流程，页面(客户端)请求服务，服务处理，响应数据，页面装载，一系列流程走下来不仅复杂，而且耗时，如果基于静态化技术处理之后，直接加载静态页面，好了请求结束。
二、流程分析
静态页面转换是一个相对复杂的过程，其中核心流程如下：
- 开发一个页面模板，即静态网页样式；
- 提供接口，给页面模板获取数据；
- 页面模板中编写数据接口返参的解析流程；
- 基于解析引擎，把数据和页面模板合并；
- 页面模板内容加载完成后转换为HTML静态页面；
- HTML静态页面上传到文件服务器；
- 客户端(Client)获取静态页面的url加载显示；
主流程大致如上，如果数据接口响应参数有变，则需要重新生成静态页，所以在数据的加载实时性上面会低很多。
三、代码实现案例
1、基础依赖
FreeMarker是一款模板引擎：即一种基于模板和要改变的数据，并用来生成输出文本（HTML网页、电子邮件、配置文件、源代码等）的通用工具。
<dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-freemarker</artifactId> </dependency>
2、页面模板
这里既使用FreeMarker开发的模板样式。
<html>
<head>
<title>PageStatic</title>
</head>
<body>
主题：${myTitle}<br/>
<#assign text="{'auth':'cicada','date':'2020-07-16'}" />
<#assign data=text?eval />
作者：${data.auth} 日期：${data.date}<br/>
<table class="table table-striped table-hover table-bordered" id="editable-sample">
<thead>
<tr>
<th>规格描述</th>
<th>产品详情</th>
</tr>
</thead>
<tbody>
<#list tableList as info>
<tr class="">
<td>${info.desc}</td>
<td><img src="${info.imgUrl}" height="80" width="80"></td>
</tr>
</#list>
</tbody>
</table><br/>
<#list imgList as imgIF>
<img src="${imgIF}" height="300" width="500">
</#list>
</body>
</html>
FreeMarker的语法和原有的HTML语法基本一致，但是具有一套自己的数据处理标签，用起来不算复杂。
3、解析过程
通过解析，把页面模板和数据接口的数据合并到一起即可。
@Service
public class PageServiceImpl implements PageService {
private static final Logger LOGGER = LoggerFactory.getLogger(PageServiceImpl.class) ;
private static final String PATH = "/templates/" ;
@Override
public void ftlToHtml() throws Exception {
// 创建配置类
Configuration configuration = new Configuration(Configuration.getVersion());
// 设置模板路径
String classpath = this.getClass().getResource("/").getPath();
configuration.setDirectoryForTemplateLoading(new File(classpath + PATH));
// 加载模板
Template template = configuration.getTemplate("my-page.ftl");
// 数据模型
Map<String, Object> map = new HashMap<>();
map.put("myTitle", "页面静态化(PageStatic)");
map.put("tableList",getList()) ;
map.put("imgList",getImgList()) ;
// 静态化页面内容
String content = FreeMarkerTemplateUtils.processTemplateIntoString(template, map);
LOGGER.info("content:{}",content);
InputStream inputStream = IOUtils.toInputStream(content,"UTF-8");
// 输出文件
FileOutputStream fileOutputStream = new FileOutputStream(new File("F:/page/newPage.html"));
IOUtils.copy(inputStream, fileOutputStream);
// 关闭流
inputStream.close();
fileOutputStream.close();
}
private List<TableInfo> getList (){
List<TableInfo> tableInfoList = new ArrayList<>() ;
tableInfoList.add(new TableInfo(Constant.desc1, Constant.img01));
tableInfoList.add(new TableInfo(Constant.desc2,Constant.img02));
return tableInfoList ;
}
private List<String> getImgList (){
List<String> imgList = new ArrayList<>() ;
imgList.add(Constant.img02) ;
imgList.add(Constant.img02) ;
return imgList ;
}
}
生成后的HTML页面直接使用浏览器打开即可，不再需要依赖任何数据接口服务。
四、源代码地址
GitHub·地址 https://github.com/cicadasmile/middle-ware-parent
GitEE·地址 https://gitee.com/cicadasmile/middle-ware-parent
到此这篇关于SpringBoot2 整合FreeMarker实现页面静态化示例详解的文章就介绍到这了,更多相关SpringBoot2 整合FreeMarker实现页面静态化内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！
相关推荐
-
Springboot整合freemarker 404问题解决方案
今天遇到了ftl整合springboot出现的问题 @Controller public class IndexController { @RequestMapping("hello") public String index(){ System.out.println("aaa"); return "index"; } } 在浏览器输入 localhost:8080/hello 控制台也打印了aaa,index.ftl也写的没有问题.就是出现了
-
SpringBoot整合freemarker的讲解
freemarker和thymeleaf是模板引擎.在早前我们使用Struts或者SpringMVC等框架的时候,使用的都是jsp,jsp的本质其实就是一个Servlet,其中的数据需要在后端进行渲染,然后再在客户端显示,效率比较低下.而模板引擎恰恰相反,其中的数据渲染是在客户端,效率方面比较理想一点.前后端不分离的话用模板引擎比较好,前后端分离的话其实用处并不大很大.Spring官方比较推荐的是thymeleaf,其文件后缀是html.本篇文章我们主要来看看SpringBoot整合freema
-
springboot 整合 freemarker代码实例
这篇文章主要介绍了springboot 整合 freemarker代码实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 依赖 <parent> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-parent</artifactId> <version>2.1.6.RELEASE&l
-
springboot整合freemarker详解
前提: 开发工具:idea 框架:spring boot.maven 1.pom文件添加依赖 <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-freemarker</artifactId> <version>1.4.1.RELEASE</version> </dependency>
-
构建SpringBoot+MyBatis+Freemarker的项目详解
现在的Java web项目已经更多的使用SpringBoot来构建了,一个是他的配置更加简单,第二个是现在流行的为服务架构Springcloud就是基于SpringBoot来实现具体的技术细节的,MyBatis也是我们常用半自动式的持久层框架.今天小编就要带领大家一起搭建一个基于SpringBoot和MyBatis以及常用高性能页面渲染框架Freemarker来构建一个用户信息查询展示的项目. 生成项目架构文件.访问SpringBoot官网生成我们需要的Maven项目需要的文件.主要有一下几个选
-
SpringBoot2.2.X用Freemarker出现404的解决
之前看到SpringBoot出了2.2.1(目前2.2.2)版本,就跑了一下发现访问地址就是404,代码跟之前是一样的,只是我把以前的(2.1.8)版本升级了而已. 后来发现SpringBoot已经把原先默认的后缀名.ftl改成了.ftlh,如果想继续保持以前的.ftl就在配置文件中配置一下就好了. spring: freemarker: suffix: .ftl 遇到问题,做个记录. 以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们.
-
SpringBoot使用FreeMarker模板发送邮件
本文实例为大家分享了SpringBoot +Mail+FreeMarker发送邮件,供大家参考,具体内容如下 通过spirngboot 自带的mail服务及FreeMarker模板引擎,发送邮 添加依赖 <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-freemarker</artifactId> </depen
-
SpringBoot2 整合FreeMarker实现页面静态化示例详解
一.页面静态化 1.动静态页面 静态页面 即静态网页,指已经装载好内容HTML页面,无需经过请求服务器数据和编译过程,直接加载到客户浏览器上显示出来.通俗的说就是生成独立的HTML页面,且不与服务器进行数据交互. 优缺点描述: 静态网页的内容稳定,页面加载速度极快: 不与服务器交互,提升安全性: 静态网页的交互性差,数据实时性很低: 维度成本高,生成很多HTML页面: 动态页面 指跟静态网页相对的一种网页编程技术,页面的内容需要请求服务器获取,在不考虑缓存的情况下,服务接口的数据变化,页面加载的
-
SpringBoot整合Freemarker实现页面静态化的详细步骤
第一步:创建项目添加依赖: <!--web和actuator(图形监控用)基本上都是一起出现的--> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web</artifactId> </dependency> <dependency> <groupId>org.spri
-
java Freemarker页面静态化实例详解
Freemarker FreeMarker 是一个用 Java 语言编写的模板引擎,它基于模板来生成文本输出.FreeMarker与 Web 容器无关,即在 Web 运行时,它并不知道 Servlet 或 HTTP.它不仅可以用作表现层的实现技术,而且还可以用于生成 XML,JSP 或 Java 等. 目前企业中:主要用 Freemarker 做静态页面或是页面展示 总结:freemarker 模版引擎,可以使用 Freemarker 模版生成 html 页面. Freemarker 语法 /*
-
java Freemarker页面静态化实例详解
Freemarker FreeMarker 是一个用 Java 语言编写的模板引擎,它基于模板来生成文本输出.FreeMarker与 Web 容器无关,即在 Web 运行时,它并不知道 Servlet 或 HTTP.它不仅可以用作表现层的实现技术,而且还可以用于生成 XML,JSP 或 Java 等. 目前企业中:主要用 Freemarker 做静态页面或是页面展示 总结:freemarker 模版引擎,可以使用 Freemarker 模版生成 html 页面. Freemarker 语法 /*
-
PHP与Web页面的交互示例详解二
前言 在<PHP学习笔记-PHP与Web页面的交互1>笔记中讲解了form表单的一些属性,包括它的输入域标记.选择域标记和文字域标记的写法,接下来的内容就是讲如何获取表单数据以及PHP数据的传递,包括对各种控件值的获取. 插入表单 提交表单之前一定得有表单,当我们的表单创建完毕后可以将表单插入Web页中,代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://w
-
PHP与Web页面的交互示例详解一
前言 这篇笔记记录的是Web表单的相关操作,Web表单主要用来在网页中发送数据到服务器.比如在日常开发中,提交注册时需要提交表单,表单从客户端传送到服务器,经过服务器处理后,再将用户所需要的信息传递回客户端,进而实现PHP与Web表单的交互. 表单 使用<form>元素,并在其中插入相关的表单元素,即可创建一个表单. 表单结构: <form name="form_name" method="method" action="url"
-
微信APP生命周期及页面生命周期示例详解
目录 官方文档 小程序的启动流程 app生命周期 页面的生命周期 页面的生命周期(图) 官方文档 https://developers.weixin.qq.com/doc/search.html?query=生命周期&doc_type=miniprogram&jumpbackUrl=%2Fdoc%2F 小程序的启动流程 我们画一个图来表示一下,整个小程序的启动流程,我们就知道了: app生命周期 执行App()函数也就是注册一个App 1 在注册app的时候,可以判断小程序的进入场景 2
-
springboot2.2 集成 activity6实现请假流程(示例详解)
新手学习记录.写在springboot test 示例 示例代码地址看结尾.后面有带页面的示例. SpringBoot Test无页面简单示例 员工请假流程 员工发起申请,附带请假信息(请假几天) 单位领导审批,如果通过,交付经理审批,不通过,重新申请 经理审批,如果请假天数不超过三天,经理1审批 如果请假天数在3-5天,经理3审批 超过5天,经理2审批 经理审批通过,流程结束,经理审批不通过,员工重新申请 流程图 代码 activiti.cfg.xml为必须文件且数据库连接正确,否则Proc
-
webpack-mvc 传统多页面组件化开发详解
最近有一个项目,还是使用的传统 MVC 模式开发,完全基于jQuery,使用了基于java模板引擎velocity,页面中嵌入了大量java语法,使得前后端分离不彻底,工程打包上线苦不堪言,为实现后端为服务化,前端也得彻底从后端中分离出来. 方案: webpack4 + ejs webpack 打包所有的 资源 打包所以的 脚本 打包所以的 图片 打包所以的 样式 打包所以的 表 ejs 高效的 JavaScript 模板引擎,代替 velocity webpack 配置 基本插件 @babel
-
ASP.NET Core缓存静态资源示例详解
背景 缓存样式表,JavaScript或图像文件等静态资源可以提高您网站的性能.在客户端,总是从缓存中加载一个静态文件,这样可以减少对服务器的请求数量,从而减少获取页面及其资源的时间.在服务器端,由于它们的请求较少,服务器可以处理更多的客户端而无需升级硬件. 虽然缓存是一件好事,但您必须确保客户端始终运行最新版本的应用程序.当您部署下一个版本的网站时,您不希望客户端使用过时的缓存版本的文件. 方案: 为确保用户始终使用最新版本的文件,我们必须为每个文件版本提供一个唯一的URL.有很多策略: 使用