WebUI Directives #

WebUI Framework offers directives for dynamic templates and streaming checkpoints without server-side JavaScript. They are processed during compilation and rendering to produce the final HTML output.

Available Directives #

WebUI Framework provides the following core directives:

• <if> Conditional Rendering - Conditionally render content based on expressions
• <for> Loop Iteration - Iterate over collections to generate repeated content
• <route> Routing - Define client-side routes that map URL paths to components
• <boundary> Streaming Boundary - Flush and hydrate complete entry-page regions in document order
• Lazy Component Policy - Defer offscreen rendering and hydration with root-template attributes
• {{}} Signal Binding - Insert dynamic values with automatic HTML escaping
• {{{}}} Raw Signal Binding - Insert unescaped HTML content
• Attribute Directives - Bind dynamic data to HTML attributes ({{}}, ?, :, and mixed)

How Directives Work #

WebUI directives are processed by the WebUI parser and transformed into a platform-agnostic protocol. This protocol is then rendered by a language-specific handler, allowing the same template to be rendered consistently across multiple platforms.

Template with directives → WebUI Protocol → Native HTML output

The WebUI protocol is a protobuf binary structure defined by a cross-language .proto schema, making it ideal for cross-platform applications.