V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
andyL
V2EX  ›  程序员

关于模版引擎

  •  1
     
  •   andyL ·
    lyleLH · 2017-02-10 16:20:34 +08:00 · 2810 次点击
    这是一个创建于 2638 天前的主题,其中的信息可能已经有所发展或是发生改变。

    有没有 V 友能给外行解释一下什么叫做模版引擎?

    找了一些资料:

    比如 Thymeleaf 这个不知道该怎么称呼的东西(有的叫框架,有的叫模版引擎,有的直接叫做“库”)

    进官网看了看, Thymeleafis a modern server-side Java template engine for both web and standalone environments

    找到个关键字 “服务端模版引擎”

    继续搜索一下,发现还有前端模版引擎和后端模版引擎一说

    当面问了一个 java 开发人员也没能讲清楚模版引擎是个什么东西,有哪些关键的作用和特性

    希望 V 友能够指点一下

    第 1 条附言  ·  2017-02-10 17:27:40 +08:00
    再次谢谢各位!
    20 条回复    2017-02-11 00:27:27 +08:00
    clino
        1
    clino  
       2017-02-10 16:35:30 +08:00   ❤️ 1
    后端模板比如我用的 uliweb 可以在 html 里嵌入 python 代码: http://limodou.github.io/uliweb-doc/zh_CN/template.html ,这样动态的网页就比较好实现了 当然这个在最好的语言本来就有了, 后端模板的执行是在服务端完成的

    前端模板比如我用的 avalonjs 可以在 html 里用专门定义的指令组件等等来达到运行时的动态执行: http://avalonjs.coding.me/directive.html ,前端模板的执行是在浏览器端完成的
    misaka19000
        2
    misaka19000  
       2017-02-10 16:39:06 +08:00   ❤️ 1
    就是本来你要生成一个网页,需要自己去拼装,很不好用。

    模板引擎可以帮助你快速生成网页,比如你要在网页上生成一个列表,以前要自己写循环,然后把这些 HTML 的源码拼起来,现在只要把这个列表放到模板引擎里面就可以,提升了开发效率,代码也变得整洁了。

    不过我还是认为前后端纯粹的分离才是正道(逃
    andyL
        3
    andyL  
    OP
       2017-02-10 16:42:02 +08:00
    @clino 谢谢啊,没做过这方面的开发,没什么具体概念,你说的属于具体实例了,有点难度😄。。
    能不能这么理解:模版这个东西是用来实现 MVC 三层的分离的,将 View 的数据更新操作所需的数据全部打包,在后端 java 代码中通过模版指定的语法将前面打包的各个数据与 java 中的数据对象绑定的一种快捷操作?
    ss098
        4
    ss098  
       2017-02-10 16:42:25 +08:00   ❤️ 1
    模版引擎就是把数据填充到一个大字符串中的指定位置,可以做一些简单的逻辑操作( if , foreach 等)。

    前端和后端模版引擎的区别就是:做填充数据、逻辑操作的这一步是在前端还是后端完成的。

    https://laravel-china.org/docs/5.3/blade

    给你一个最好的语言的模版引擎,我觉得它思路清晰。
    andyL
        5
    andyL  
    OP
       2017-02-10 16:43:55 +08:00
    @misaka19000 这个例子不错,有点概念了。有前端模版引擎和后端模版殷勤一说吗?你说的是属于哪一种?
    clino
        6
    clino  
       2017-02-10 16:54:50 +08:00
    @andyL 模板引擎就是生成动态页面的一个方法,后端语言可以从后端(如数据库)获取到状态,所以可以由后端语言生成 html,但完全靠后端语言自己拼 html 太麻烦,就搞个模板引擎,这样在 html 里可以直接调用后端语言生成部分 html,其他固定的 html 就直接在模板文件里写死

    前端模板也是类似,它的状态可以在 javascript 里存放,也可以由 javascript 调用后端 api 获得,此时也有同样的问题,完全由前端 js 生成 html 是可行的,但是太麻烦不好维护,所以又搞出了前端模板
    bianhua
        7
    bianhua  
       2017-02-10 17:00:16 +08:00   ❤️ 1
    > 有没有 V 友能给外行解释一下什么叫做模版引擎?

    模板引擎指的是一种根据特殊语法或者模式( Pattern ),通过预设规则生成内容的转换程序。

    比如 Thymeleaf 是一种使用 Java 编写的 HTML 模板引擎。它可以解析并处理 HTML 中的代码,并通过这些代码来调用 Java 中的预设函数或数据来产生新的 HTML 内容。
    andyL
        8
    andyL  
    OP
       2017-02-10 17:00:28 +08:00
    @clino 大概清楚是个什么东西了,非常感谢。
    cszeus
        9
    cszeus  
       2017-02-10 17:03:21 +08:00   ❤️ 1
    举个例子讲讲我个人的理解。

    比如说,你看到的网页,其实就是一个很大的<html>xxxxx</html>文档。只要有了这个文档,浏览器就能显示页面。在以前网站都是静态的时候,服务器都直接把这个写好的 html 发给你。后来,网站复杂了,大家发现一个页面一个 html 不行,太累了,而且很多页面其实主要部分是一样的,中间有一些不一样。结果大家想出来的方法就是用代码生成,比如 html = '<html>' + customer+'</html>'。根据 customer 的不同,可以生成不同的 html 。

    再后来,发现这么写代码拼出来还是太麻烦了,而且控制逻辑跟负责显示的 html 耦合很严重,就发明了模板引擎。我定义个模板,比如长这样:<html>{customer}</html>。其中{customer}也是个变量。当然,这个模板可以很长,很复杂,带很多变量。我现在要做的,就是告诉模板引擎我想用哪个模板,其中变量的值分别是多少,它就可以自动给我生成 html 了。这里,模板只负责展示,你的代码可以通过各种逻辑获得变量的值,让模板引擎去渲染,就解耦了。

    前后端模板引擎,对我来说,就是服务器渲染出 html 直接返回给浏览器,还是服务器传值回来,由前端的 js 生成 html 的区别吧。
    andyL
        10
    andyL  
    OP
       2017-02-10 17:05:28 +08:00
    @bianhua 噢,那么使用 Thymeleaf 模版引擎的项目,只会前端的人想根据新的设计图重新写一下前端 UI 能搞定吗?
    就是完全不会 java 代码的, eclipse 都不会用,打开工程啥都看不懂的,更不能写业务逻辑的前端人员能直接只修改 UI 吗?😓💦
    cszeus
        11
    cszeus  
       2017-02-10 17:07:10 +08:00
    @andyL 可以的
    andyL
        12
    andyL  
    OP
       2017-02-10 17:08:39 +08:00
    @cszeus 噢😯? 直接修改 tomcat 服务器上的 www 文件夹下面的 html 源码中的样式就行了嘛?
    misaka19000
        13
    misaka19000  
       2017-02-10 17:15:17 +08:00
    @andyL 后端模板引擎的话就是在后端把网页生成好了然后再发给前端;前端模板引擎就是后端只发数据,前端使用 JS 把获取到的数据渲染在页面上,就酱~
    andyL
        14
    andyL  
    OP
       2017-02-10 17:18:06 +08:00
    @misaka19000 在前面的讨论基础上,你这个总结显得异常地简洁明了!😄
    bianhua
        15
    bianhua  
       2017-02-10 17:19:21 +08:00   ❤️ 1
    @andyL

    短答案:是的。事实上这就是模板引擎存在的意义——让前端不需要担心后端那些复杂的逻辑,只需要处理手头上这些后端给到的数据就行了。这样前端的工作负担就能大大减轻了。

    长答案:这需要看你如何安排你的项目,以及新的设计是否引入了需要后端一起变更的功能。

    我没有用过这个模板引擎,但我看了下它的文档,感觉跟大多数模板引擎套路一致:分配或者映射一个变量,把它交给模板引擎,模板引擎根据模板语法解析出那个变量,将变量(或变量解析后的)内容填充到页面上。

    你看,模板引擎得到的变量都是后端给的,前端自己不能“得到”这些东西。所以如果你的前端需要得到这些数据,就需要后端将数据“给”前端(虽然在实际意义上是同一个程序)。

    但是如果前端的变更无需调用新的数据,那么大体上就不需要后端参与 UI 更新了。
    andyL
        16
    andyL  
    OP
       2017-02-10 17:20:28 +08:00
    @bianhua 逻辑清晰,语句通顺,哈哈。感谢🙏
    seeker
        17
    seeker  
       2017-02-10 17:23:32 +08:00
    数据+模版->带格式的数据
    模版引擎就是做转换的那一步。
    tedzhou1221
        18
    tedzhou1221  
       2017-02-10 17:34:25 +08:00 via iPhone
    简单点:就跟 ppt 模版一样,在模版上加上自定义的数据或文字内容等。

    我比较喜欢用 freemark
    publicAdmin
        19
    publicAdmin  
       2017-02-10 23:58:26 +08:00
    @misaka19000 之前看 JD 某大神分享的文章,有提到他们在 JD 商品页面大量使用了模板引擎,为了让前端更快速的响应加载。 JD 这种体量的系统,也用模板引擎,是不是代表绝对的前后端分离也只是理想化的?
    misaka19000
        20
    misaka19000  
       2017-02-11 00:27:27 +08:00
    @publicAdmin 事实上这种电商网站由于活动特别多,所以一般反而会大量使用前后端分离。不考虑京东的主站,京东在一些小型的活动页面上经常会使用纯粹的前后端分离策略,因为这样一来后端只需要提供接口,相对变化较小,而前端则可以非常灵活。总之还是一句话:根据需求而定自己使用什么样的策略。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   2421 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 36ms · UTC 13:33 · PVG 21:33 · LAX 06:33 · JFK 09:33
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.