[Dev] 22.09.15. Thymeleaf 를 사용하는 이유

Thymeleaf 를 사용하는 이유

 기존에는 thymeleaf를 사용할 생각이 전혀 없었다. Front-end는 단순히 html과 bootstrap을 통한 css, javascript를 기반으로 jsp 를 사용하려고 생각했으며, Back-end를 SpringBoot를 사용해볼 생각이었다. 그런데 처음 필자에게 SpringBoot 강의를 들어보고 작업을 해보라고 권유해준 현직 지인이 front를 vue.js를 사용했다고 하여, 국비 과정 속에 잠시 배웠던 vue.js 내용을 참고해서 만들어 볼 생각이었다. 그러면서 들어온 질문이 thymeleaf는 배웠냐는 것이었다.

 우리말로 들으면 타임리프. 당연히 time leap가 먼저 생각날 수밖에 없었는데, 실제로는 thymeleaf로 단어를 검색해보면 '쌍떡잎식물 통화식물목 꿀풀과의 여러해살이풀의 잎' 이라는 의미이다. 어원이랑은 전혀 상관이 없어보인다. 무언가를 알아볼 때 나x위x는 열어보는 것이 아니라고 했지만 간단히 알아보려고 확인해본 내용은 다음과 같았다.

 

자바 기반의 XML/XHTML/HTML5 템플릿 엔진으로, MVC 패턴에 적합하게 설계되었다.
Spring Framework와의 조합이 뛰어나다. 현재 지원이 거의 중단된 JSP에 대한 대안으로 떠오르고 있다.
타임리프는 현재 오픈소스로 제공되고 있다.

 JSP에 대한 지원이 거의 중단되었다고 언급하고 있으며, 그 대안으로 떠올라 사용하는 것이 thymeleaf라고 한다. 필자는 국비에서의 두 차례 project에서 JSP를 사용했는데, semi project에서는 JSP만을 사용했고 final project에서는 JSP와 JSTL을 사용했었다.

 

 Thymeleaf는 web과 독립된 하나의 환경 모두에 대한 최신 server-side Java template engine(템플릿 엔진)이다. 주 목적은 당신의 개발 workflow에 elegant한 natural templates를 주는 것이다. HTML은 browser에 올바르게 보여질 것이고, static prototype으로 동작할 것이며, 개발 팀에서 강력한 협업이 가능하도록 할 것이다. Spring Framework, 당신이 주로 사용하는 tools, 당신 스스로의 기술력에 더해져서 이 Thymeleaf는 현대 사회 HTML5 JVM web development의 이상이 된다.

 

 대안으로 사용한다는 thymeleaf에 대해 알아보기 위해 공식 홈페이지에 들어가본 것이다.^[각주:1] 이 말을 조금 더 이해해보기 위해서 다른 블로그에서 언급한 내용들을 찾아보았다. 템플릿 엔진이 무엇인지, thymeleaf를 사용했을 때의 장단점은 무엇인지 정리하면 다음과 같다.

 

 

Template Engine (템플릿 엔진)

 우선 템플릿 엔진이 무엇인지 알고 지나가야 할 것 같다. 다음의 블로그들을 참고했다.^{[각주:2] [각주:3]}

 Template engine은 template 양식과 data model에 따른 입력 자료를 결합하여 문서를 출력하는 소프트웨어라고 한다. 그 중에서 web template engine은 웹 문서가 출력되는 것을 말한다. Template이라고 하는 것은 '형판, 견본' 이라는 사전적 의미를 지니는데, 일종의 '틀' 이라고 생각하면 좋을 것 같다. 즉, template 양식인 HTML과 DB data가 합쳐져서 HTML을 출력하는 소프트웨어가 web template engine인 것이다. 이 template engine은 여러 가지로 나눌 수 있는 것 같은데, 크게 client-side와 server-side template engine으로 나눠볼 수 있다.

 먼저 client-side template engine에는 대표적으로 vue.js와 react.js, Mustache를 예로 들 수 있다. Browser 위에 html로 화면을 생성한 뒤, server에서 받은 json이나 xml 형식의 data를 받아 화면을 동적으로 구성하는 친구들이다.

 반면 server-side template engine에는 JSP, FreeMarker, Thymeleaf, Velocity를 예로 들 수 있다. Server에서 가져온 data를 미리 만들어진 template에 넣어 HTML을 완성시켜서 client에 전달하는 방식으로 동작하는 친구들이다.

 

 이 중에서 Spring Boot가 자동 설정을 지원하는 template engine은 Mustache, FreeMarker, Thymeleaf 이다. 이 중에서 Thymeleaf가 인기가 많다고 하며, 필자도 지인의 권유로 사용해보려고 하는 것이다.

 

장점

1. Thymeleaf는 jar 로 export가 가능하다.

Jar로 export가 가능한지 여부가 가장 큰 차이점이라고 언급한 블로그들이 있었다.^{[각주:4] [각주:5]} 기본적으로 Spring project는 jar가 build 된다고 한다. 하지만 JSP는 war만 가능하고 jar는 불가능하다. 게다가 war는 웹 서버나 WAS(Web Application Server)가 필요하고, WEB-INF directory에서 사전 정의된 구조만을 사용하는 문제도 있고, 최근 추세가 또 war가 아닌 jar로 배포하는 것이라고 하니 JSP를 사용하는 것은 단점이 될 수 있다.

 

 비슷한 내용이 Spring Boot docs에 나와있다.^[각주:6] 읽어보면 다음과 같은 내용이다.

• Jetty와 Tomcat과 JSP를 사용할 때, war packaging을 사용하면 정상적으로 동작할 것이다. 실행 가능한 war는 java -jar 로 실행해도 동작할 것이고, 어떤 standard container에도 활용될 수 있다. 하지만 JSP는 실행 가능한 jar를 사용할 때 지원되지 않는다.
• Undertow라는 내장 WAS(Web Application Server)는 JSP를 지원하지 않는다.
• Custom error.jsp 페이지를 만드는 것이 error handling을 위한 default view를 override 하지 못한다. error.jsp가 아닌 custom error page를 대신 사용해야만 한다.

 

2. 페이지의 proto type을 제공할 수 있다.

 Thymeleaf 의 장점은 페이지를 생성하는데 필요한 정보를 태그의 속성으로 넣고, remove 속성을 이용해서 실제 생성될 페이지에서는 제거될 태그를 넣을 수 있어서 페이지의 proto type을 제공할 수 있다는 것이다. Thymeleaf로 작성된 페이지를 웹 브라우저로 열어보면 실제 보여질 내용을 동일하게 볼 수 있다.

 

3. 디자이너나 퍼블리셔가 작업할 때 WAS를 실행하지 않아도 된다.

 디자이너 또는 퍼블리셔가 페이지를 생성하거나 수정할 때 톰캣 같은 웹서버를 실행하지 않고 오프라인에서 수정을 할 수 있다. 즉, WAS 없이도 화면을 출력할 수 있다는 것이다. 이는 페이지를 디자인할 때, server를 실행해야하는 번거로움을 없애준다.

 

단점

1. 속도

 2018년도 자료가 있어서 가져왔다.^[각주:7] 가로축은 response time인데 thymeleaf 가 하위권에 속해있는 것을 볼 수 있다. JSP보다도 늦다.

 

 하지만 느린 대신에 WAS 없이도 HTML 페이지를 띄워 확인하면서 작업할 수 있다는 것은 협업 측면에서 아주 큰 장점이다. 그래서 사람들에게도 인기가 있는 것 같다.

 Thymeleaf 라는 친구는 꽤나 여러모로 괜찮은 친구인 것 같다. 사족이 좀 길었던 것 같다. Back-end 직무를 희망하는 사람이지만 아무 것도 모른채로 그냥 무턱대고 다루기는 싫었다. 대략이라도 어떤 친구인지 알았으니 본격적으로 코딩을 해보려고 한다.

 

Reference

1. Thymeleaf [본문으로]
2. [자바 템플릿엔진] jsp는 이제 안녕? thymeleaf란? (tistory.com) [본문으로]
3. [Web] 템플릿 엔진, JSP, Thymeleaf란? 서버 사이드 템플릿 엔진 vs 클라이언트 사이드 템플릿 엔진 (tistory.com) [본문으로]
4. Thymeleaf vs JSP (velog.io) [본문으로]
5. thymeleaf vs jsp (tistory.com) [본문으로]
6. Spring Boot Reference Guide [본문으로]
7. Modern Type-Safe Template Engines (Part 2) - DZone Web Dev [본문으로]