📄️ Overview
Some configuration options and item properties admit templates. Custom Sidebar admits two templating systems, JavaScript templates or Jinja templates. JavaScript templates are processed faster because the rendering is done in client side, Jinja templates need to perform a WebSocket call] to receive the template result, but in general you should not notice many differences between the two in terms of performance. The main differences between the two templating systems (apart from the syntax) are that JavaScript can access client side data like DOM APIs, can return [Promises], can work with [Reactive JavaScript Variables and can execute several JavaScript methods like opening dialogs or call services. Jinja templates do not have all these features.
📄️ JavaScript Templates
This templating system IS NOT the same that Home Assistant implements. It is basically a JavaScript code block in which you can use certain client-side objects, variables and methods. To set a property as a JavaScript template block, include the code between three square brackets [[[ JavaScript code ]]]. If you don‘t use the square brackets, the property will be interpreted as a regular string.
📄️ Jinja Templates
This templating system is the same that Home Assistant implements. You can use the majority of the template methods and objects. The entire template will be processed, rendered and the result will be used as the desired option. If you don't want to display anything in certain scenarios, you should return an empty string in those cases. The next client side varianles will be available in Jinja templates: