关于页面静态化

时间 2019-11-12

标签关于页面静态栏目网站开发繁體版

原文原文链接

页面静态化

页面静态化就是将页面模版和数据经过技术手段将两者合二为一，生成一个html网页文件html

页面静态化也是网站性能优化的一个方向之一，其余的网站优化好比：缓存、分布式分散请求、数据库读写分离等数据库

页面静态化的优点/劣势

访问速度加快，不须要或者减小去访问数据库的频率，使用缓存浏览器直接加载渲染html网页便可浏览器
爬虫或者搜索引擎更喜欢静态的页面（容易被命中）缓存
安全、稳定安全
随着时间的推移或者产品的升级，静态化产生的页面日渐增多，须要的容积不可小觑性能优化

大体了解静态化技术

制做模版 + 获取模版数据 -----通过页面静态化-------> 生成html，存放到文件系统中 -------->通常使用Nginx的静态代理向外提供服务网络

目前静态化页面都是经过模板引擎来生成的，而来保存到Nginx来部署，经常使用的模版引擎如：app

Freemarker（比较熟悉）分布式
Thymeleaf（了解）函数
Velocity（不明白，不清楚，不晓得！）

这里咱们就对前两种模板引擎作一个简单的介绍吧，第三种之后遇到再作补充

Freemarker模版引擎

Freemarker入门

首先freemarker得入个门吧，看看之前的学习笔记：http://www.javashuo.com/article/p-vqxzlqaz-a.html

基于模版文件静态化

这种方式，须要咱们在resources文件中建立一个templates文件夹，再建立一个模版文件，

在下方这个Demo中，咱们得建立一个test1.ftl的模版文件，

@Test public void GenerathHtml() throws IOException, TemplateException { //建立配置类，这个类:import freemarker.template.Configuration;
        Configuration configuration = new Configuration(Configuration.getVersion()); //设置模版路径
        String path = this.getClass().getResource("/").getPath(); System.out.println("模版路径为 :" + path); configuration.setDirectoryForTemplateLoading( new File(path + "/templates/")); //设置字符集
        configuration.setDefaultEncoding("UTF-8"); //加载模版
        Template template = configuration.getTemplate("test1.ftl"); //数据模型
        Map<String,Object> map = new HashMap(); map.put("song", "你脸巴儿已经皱得像条鱼摆摆"); //静态化
        String content = FreeMarkerTemplateUtils.processTemplateIntoString(template, map); System.out.println("咱们打印一下静态化的内容 :" + content); //转化为流
        InputStream inputStream = IOUtils.toInputStream(content); //输出文件
        FileOutputStream fileOutputStream = new FileOutputStream(new File("F:\\test1.html")); int copy = IOUtils.copy(inputStream, fileOutputStream); System.out.println(copy);//209
    }

模板文件test1.ftl的内容为：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>FreemarkerTest1</title>
</head>
<body>
   小伙子，你不要拽，${song}！ 
</body>
</html>

关于测试的总体结构以下

最后会给咱们生成一个静态的html:咱们打开看看：

这个时候咱们就能够把这个页面部署到Nginx服务上，向外提供服务

基于模版字符串静态化

上面这一种方式，咱们是将模版写在资源文件下的templates下的，而基于模版字符串的静态化是字节在代码中写死了的，

 @Test public void GenerathHtmlByString() throws IOException, TemplateException { //建立配置类
        Configuration configuration = new Configuration(Configuration.getVersion()); //模版内容
        String templateString = "<html>\n" +
                "<head>\n" +
                "    <meta charset=\"UTF-8\">\n" +
                "    <title>FreemarkerTest1</title>\n" +
                "</head>\n" +
                "<body>\n" +
                "   老同志，你也不要拽，${song}！\n" +
                "   \n" +
                "</body>\n" +
                "</html>"; //模版加载器
        StringTemplateLoader loader = new StringTemplateLoader(); loader.putTemplate("template", templateString); configuration.setTemplateLoader(loader); //获得模版
        Template template = configuration.getTemplate("template", "UTF-8");  //定义数据模型
        Map<String,Object> map = new HashMap<>(); map.put("song", "你一个月的工资才二十来块"); //静态化
        String content = FreeMarkerTemplateUtils.processTemplateIntoString(template, map); System.out.println("咱们打印一下静态化的内容 :" + content);  //转化为流
        InputStream inputStream = IOUtils.toInputStream(content); //输出文件
        FileOutputStream fileOutputStream = new FileOutputStream(new File("F:\\test2.html")); int copy = IOUtils.copy(inputStream, fileOutputStream); System.out.println(copy);//209
    }

随后也会在咱们指定的位置问咱们生成一个静态化页面，咱们能够去看看：

Thymeleaf模版引擎

Thymleaf入门

首先freemarker得入个门吧，看看之前的学习笔记：http://www.javashuo.com/article/p-qvlyhdqm-a.html

咱们先对几个概念进行一下阐述：

Context：运行上下文

用来保存模型数据，当模板引擎渲染时，能够从Context上下文中获取数据用于渲染。

当与SpringBoot结合使用时，咱们放入Model的数据就会被处理到Context，就会做为模板渲染的数据使用。
TemplateResolver：模版解析器

用来读取模板相关的配置，例如：模板存放的位置信息，模板文件名称，模板文件的类型等等。

当与SpringBoot结合时，TemplateResolver已经由其建立完成，而且各类配置也都有默认值，好比模板存放位置，其默认值就是：templates。好比模板文件类型，其默认值就是html。
Templateengine：模版引擎
用来解析模板的引擎，须要使用到上下文、模板解析器；

分别从二者中获取模板中须要的数据，模板文件。而后利用内置的语法规则解析，从而输出解析后的文件。

模版引擎处理的函数：
```
//三个参数分别是模版名称、上下文、输出目的地的流对象
templateEngine.process("模板名", context, writer);
```
经过对第三个参数的设定，若是目的地是Response的流，那就是网络响应。若是目的地是本地文件，那就实现静态化了。

而在SpringBoot中已经自动配置了模板引擎，所以咱们不须要关心这个。如今咱们作静态化，就是把输出的目的地改为本地文件便可！

基于模版文件静态化

模版文件：hello1.html

配置文件：application.yml

查看一下静态化生成的文件：hell3.html