Thymeleaf 3 Standard Layout System Improvements

By

Thymeleaf 3 improved Standard Layout System so that creating layouts is more flexible as ever before.

Use th:insert instead of th:include

th:include is not recommended anymore and it will be deprecated in future versions of Thymeleaf. th:insert is recommended as of Thymeleaf 3 and it behaves similarly to old th:include with the difference that it inserts the whole fragment into body, not only the fragment’s body.

Check this section in Thymeleaf documentation: Difference between th:insert and th:replace and th:include

Markup Selectors

Fragments don’t need to be explicitly specified using th:fragment at the page they are extracted from. Thymeleaf can select an arbitrary section of a page as a fragment (even a page living on an external server) by means of its Markup Selector (previously DOM Selector) syntax, similar to XPath expressions, CSS or jQuery selectors:

<div th:insert="template :: //div[@class='content']">

</div>

For the Markup Selector syntax reference checkout this section in Thymeleaf documentation: Markup Selector syntax.

Fragment Expressions

Fragment expressions allows creating fragments in a way such that they can be enriched with markup coming from the calling templates, resulting in a layout mechanism that is far more flexible than th:insert and th:replace only:

<div th:replace="${#authentication.principal.isAdmin()} ? ~{fragments/footer :: footer-admin} : ~{fragments/footer :: footer-admin}">

</div>

The idea of this syntax is to be able to use resolved fragments as any other kind of objects in the template execution context for later use.

Fragment Expression enables the customization of fragments in ways that until now were only possible using the 3rd party Layout Dialect. Read more about this topic in the Thymeleaf documentation: Flexible layouts: beyond mere fragment insertion

See more

Popular posts from this blog

Parameterized tests in JavaScript with Jest

By
Parameterized tests are used to test the same code under different conditions. One can set up a test method that retrieves data from a data source. This data source can be a collection of objects, external file or maybe even a database. The general idea is to make it easy to test different conditions with the same test method to avoid duplication and make the code easier to read and maintain. Jest has a built-in support for tests parameterized with data table that can be provided either by an array of arrays or as tagged template literal .
Read more