江门网站免费制作/网上怎么做推广

1 模板引擎的使用

1.1 下载模板

首先安装art-template模板，art-template不仅可以在浏览器使用，也可以在node中使用

安装，在哪个目录执行以下命令就会下载到那里去，默认下载到node_modules目录中，注意node_modules尽量不要更改，不支持更改

npm install art-templatenpm install=npm i。在git clone项目的时候，项目文件中并没有 node_modules文件夹，项目的依赖文件可
能很大。直接执行，npm会根据package.json配置文件中的依赖配置下载安装。
-global=-g，全局安装，安装后的包位于系统预设目录下
--save=-S，安装的包将写入package.json里面的dependencies，dependencies：生产环境需要依赖的库
--save-dev=-D，安装的包将写入packege.json里面的devDependencies，devdependencies：只有开发环境下
需要依赖的库

1.2 在浏览器中使用

在浏览器中是使用node_modules/lib/template-web.js文件，把脚本类型声明为模板类型，防止浏览器安装JavaScript脚本方法来解析

注意：模板引擎不关心字符串内容，只关心自己能认识的模板标记语法，例如 {{}}， {{}} 语法被称之为mustache语法，即八字胡语法

${}是estl语法，{{ $value }}是模板语法

<script type="text/template" id="tp1">hello {{ name}}
我喜欢：{{each hobbies}} {{ $value }} {{/each}}
</script><script>
<!-- template()中第一个参数是模板id,第二个参数是对象 -->var ret = template('tpl', {name: 'Jack',hobbies: ['写代码','唱歌','打游戏']})console.log(ret)
</script>

1.3 node中使用模板引擎

先安装npm install art-template ,在需要使用的地方使用require( ) 方法加载art-template,就可以了，require中的参数名字是npm install 后面的名字，${}是estl语法，{{ $value }}是模板语法

var template = require("art-template");
var ret = template.render("hello {{name }} ，我的爱好是{{each hobbies}} {{ $value }}{{/each}}",{name :"jack",hobbies:["看电影","唱歌"]
})

template.render()方法第一个是要替换的字符串，第二个是参数

2 服务端和客户端渲染

• 客户端渲染：第一次请求服务器拿到页面，第二次请求拿到数据
• 服务端渲染：一次请求就完成了全部页面+数据

服务端渲染后就是最终的结果，可能会加大服务器压力，但是客户端渲染的话，即使没有数据，也可以先加载出来一部分，不至于全部空白，另外，客户端渲染不利于SEO搜索引擎优化，服务端渲染是可以被爬虫抓取到的，客户端异步渲染是很难被爬虫抓取到，所以一般的网站是两者结合的

3 统一处理静态资源

为了让目录结构保持统一清晰，所以约定，把所有的 HTML 文件都放到 views（视图） 目录中，为了方便的统一处理这些静态资源，所以约定把所有的静态资源都存放在 public 目录中，哪些资源能被用户访问，哪些资源不能被用户访问，现在可以通过代码来进行非常灵活的控制

浏览器收到 HTML 响应内容之后，就要开始从上到下依次解析，当在解析的过程中，如果发现：

• link
• script
• img
• iframe
• video
• audio

    等带有 src 或者 href（link） 属性标签（具有外链的资源）的时候，浏览器会自动对这些资源发起新的请求。

注意：在服务端中，文件中的路径就不要去写相对路径了。因为这个时候所有的资源都是通过 url 标识来获取的，假如服务器开放了 /public/ 目录，所以这里的请求路径都写成：/public/xxx，正斜杠  / 在这里就是 url 根路径的意思。浏览器在真正发请求的时候会最终把 http://127.0.0.1:3000 拼上