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

模板引擎是什么? thymeleaf 和 js/css/html 是什么关系?

  •  
  •   gransh · 2019-01-03 21:57:20 +08:00 · 5472 次点击
    这是一个创建于 1911 天前的主题,其中的信息可能已经有所发展或是发生改变。
    java 后端,最近在学习 springboot,看到到处推荐 thymeleaf 模板引擎就看了下。谈到用法也就是 pom 引入依赖然后直接写页面,说实话没理解这个所谓的模板引擎是在哪起作用的。。。。
    对前端的了解有限,我所知道的 js/css/html 三件套,js 负责逻辑,css 负责样式,html 负责布局,那 thymeleaf 替代的是哪一部分,或者能明确描述下跟这三者的关系?以前用 jsp 就是一个 servlet 的作用,thymeleaf 跟 jsp 的区别又在哪?

    另外附加一个前端的问题,我看很多前端框架都是用网址引入,例如 href="https://cdn.bootcss.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css",这样子不会影响加载速度吗?如果网站是内网使用,就不能这么用框架吧?
    4 条回复    2019-01-04 19:04:49 +08:00
    Sparetire
        1
    Sparetire  
       2019-01-03 23:27:58 +08:00 via Android   ❤️ 3
    html 页面就是个字符串,模板引擎就是给了你模板引擎自定义的语法,用来对这个字符串进行变量 /表达式的替换最后还是得到 html 的字符串
    前端模板就是这个替换操作在浏览器用 js 执行,比如 react,vue,不过它们不仅仅是模板。后端模板就是替换操作在后端执行
    前端替换叫前端渲染,后端替换叫后端渲染,你也可以后端渲染完生成 html 给前端,前端拿到这个 html 再做一次替换
    html,css,js 都是浏览器的事,所以后端模板引擎和这三者都不存在替代关系
    jsp 也算是模板引擎,和 thymeleaf 就是语法 /性能 /其他功能强弱有无的区别,反正模板引擎做的事基本上都是输入模板+变量,输出 html 字符串,有些加个缓存
    通过 cdn 引入 js,css 绝大部分时候不会导致加载变慢,浏览器会并行下载它们
    ModerRAS
        2
    ModerRAS  
       2019-01-04 00:02:56 +08:00 via Android   ❤️ 2
    模板语言通过指定的语法填充数据,然后执行部分是模板引擎。相当于后端获取到要填充的数据之后按照指定格式填充到模板语言指定的位置,然后这样子发给前端去渲染。内网使用的话你就把那个资源下载到本地然后挂 Nginx 上就好。加载速度感觉靠浏览器内核了,好像现在火狐还是先加载 html 渲染着加载其他的(我自己开 GitHub 直连容易只有 html 没有 CSS,然后过一会就出来了的情况),所以没加载完会不好看,chrome 总感觉是一口气出来的所以会慢吧,不过静态资源只要网络带宽够一般不会慢的。
    gransh
        3
    gransh  
    OP
       2019-01-04 10:29:13 +08:00
    谢楼上,解释的很清楚
    charten
        4
    charten  
       2019-01-04 19:04:49 +08:00
    回答前端的问题,如果网站是内网使用的,建议放内网服务器上,速度比使用 cdn 会更快一点。用外链 cdn 的话,要做好第三方 cdn 坏链的心理准备。。。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   3003 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 31ms · UTC 15:02 · PVG 23:02 · LAX 08:02 · JFK 11:02
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.