HTMLx

screenshot of HTMLx

One Template to rule them all

Overview:

The HTMLxOne Template is a proposed common language designed to meet the needs of various frameworks built around HTML templates, such as Svelte, Vue, Ractive, Glimmer, and more. The goal of HTMLxOne Template is to provide a shared language for these frameworks, reducing the need to reinvent tools and syntax for each new framework. This would enable collaboration on tooling and reduce friction for new users who would no longer have to learn a new syntax for each framework.

Features:

  • Tags: Lowercase tags represent regular HTML elements, while capitalized tags indicate components specific to a framework.
  • Attributes: Attributes in HTMLxOne Template work the same as in regular HTML, supporting unquoted values, JavaScript expressions as values, and shorthand for passing properties to elements or components.
  • Text Expressions: Text in HTMLxOne Template can contain JavaScript expressions.
  • HTML Expressions: HTML can be injected within a text expression using the {@html expression} syntax.
  • Control Flow: Conditional rendering can be done using {#if condition} blocks, with additional conditions and iterative rendering supported.

Summary:

The HTMLxOne Template is designed to provide a shared language for HTML-based frameworks, allowing collaboration on tooling and reducing the learning curve for new users. The template syntax and features proposed in HTMLxOne Template aim to unify the existing fragmented landscape of HTML-based frameworks and improve the development experience for developers using these frameworks.