Mustache or Thymeleaf for java templating responsive webpage?

I have an existing java backend and would like to set up a responsive webpage on it. The page will be mainly for administration purposes, but might get bigger with lots of features.

The page should be state of the art, means using bootstrap, jquery, provide a responsive layout and may need to use HTML5 components.

I do not want to use frameworks like angularjs, as I’m not that familiar with JavaScript or TypeScript for angularjs2.

Also if possible I don’t want to expose an extra REST/JSON/XML webservice for the page. As all the administration should be done by using the webpage, and not by accessing backend webservices.

So it’s probably best to chose one of the serverside tempalting engines.
There are two templating engines the qualify at first sight:

  • Mustache
  • Thymeleaf

Which of them would you chose from a view of a java programmer, and in terms of:

  • binding java objects to the html
  • showing large lists and tables from database, maybe with inline editing
  • compatibility with bootstrap and a responsive design
  • framework being maintained in the future and support not being dropped (like if you had chosen angularjs1 2 years ago, you would now have to rewrite the complete code to angularjs2. I’d prefer a framework being developed further, but not having to drop existing code for upgrading).

Thymeleaf and mustache are template engines. Template engines build html with your objects and their features helps you to render html easily.

For example (Thymeleaf code):

<div th:each="str,iterStat : strings">
   <span th:text="${str}"/><!--This will print the index value-->
   <span th:text="${iterStat.index}"/><!--This will print the Index-->
</div> 

Html output (strings contains “A”, “B”):

<div>
    <span>A</span>
    <span>0</span>
</div>

<div>
    <span>B</span>
    <span>1</span>
</div>

If you want this output shown as responsively, you must control your html and css.

I have experience of working with Mustache. It is pretty good in what it is supposed to do, i.e. bind objects with HTML. I’ve used it with bootstrap and JQuery. I’ve created pages where the user can fill up some forms and then the form values are used to call GET APIs. It can download the results in any format or it can show the results in HTML tables. I’ve also used it to call POST and PUT APIs using the form values. All this can be done pretty easily with Mustache and the amount of code required is also pretty less. I haven’t worked with Thymeleaf, so I can’t comment on it. But I’m pretty happy with Mustache.

That said, if you’re sure the UI is going to get bigger with lots of features, I’ll suggest you to not take this approach at all. Go for some front-end framework, viz ReactJS, Vue.js, etc. Here’s the thing, the project that I worked on using Mustache has become pretty big now. There are many features and the UI itself requires a lot of business logic. However, Mustache doesn’t allow to incorporate logic (it’s tag-line says logic-less templates). So, now my backend code is getting messy because I need to handle a lot of conditions and then make sure that the responses that my APIs send back don’t need any more logic to be applied before Mustache can render it in HTML. If you want to apply even the slightest of logic on the API responses before you render it in HTML, you can’t do it using Mustache.