I find the popularity of JSX-style templating really surprising.

    <div>
      <h1>Conditional Display and Looping in JSX</h1>
      <ul>
        {this.state.items.map(item => (
          item.show ? <li key={item.id}>{item.name}</li> : null
        ))}
      </ul>
    </div>

That seems like such an unintuitive way of implementing loops and if statements!

I helped design the Django template language, where the above would look like this instead:

    <div>
      <h1>Conditional Display and Looping in Django Template</h1>
      <ul>
        {% for item in items %}
          {% if item.show %}
            <li>{{ item.name }}</li>
          {% endif %}
        {% endfor %}
      </ul>
    </div>

I do like the type signature aspect of it that you're talking about - I've found myself wanting that for Django templates in the past, to the point that I've started figuring out patterns for populating templates using typed Python dataclasses as opposed to anything-goes-dictionaries.