X_component - component-based HTML templates for Elixir/Phoenix, inspired by Vue

x_component is a component-based HTML template library for Elixir. It uses template syntax and component-based approach similar to Vuejs. This library can replace Phoenix views/templates and phoenix_html in a Phoenix project (details).

• Declarative HTML template syntax close to Vue.
• Compile time errors and warnings.
• Type checks with dialyzer specs.
• Template code formatter.
• Inline, context-aware components.
• Smart attributes merge.
• Decorator components.
• Fast compilation and rendering.
• Optimized for Gettext/Phoenix/ElixirLS.
• Components generator task.

X components HTML rendering shows slightly better results than EEx with Phoenix.HTML.Engine . It was achieved due to safe/unsafe interpolation syntax (instead of {:safe, ...} tuples) and due to more compact HTML output with trimmed whitespaces (example). However, it shows a significantly faster rendering of nested components (templates in case of EEx) due to the inline components compilation:

Comparison:
X inline (iodata)          20.38 K
X inline (string)          14.48 K - 1.41x slower +19.99 μs
Phoenix EEx (iodata)        7.52 K - 2.71x slower +83.99 μs
Phoenix EEx (string)        6.43 K - 3.17x slower +106.39 μs

• Docs
• Benchmarks
• Examples