pub fn Page(allocator: zx.Allocator) zx.Component {
    const hello_child = (<div @allocator={allocator}>Hello!</div>);
    return (
        <section @allocator={allocator}>
            <ChildComponent children={hello_child} />
            <ChildComponent children={(<div>Hello!</div>)} />
        </section>
    );
}

// Note: Not providing allocator here will use the default allocator (std.heap.page_allocator) and will have performance penalty
// Only use this when you need to create a component that doesn't need to allocate memory, like a complete static element.
const hello_child_outside = (<div>Hello!</div>);

const Props = struct { children: zx.Component };
pub fn ChildComponent(allocator: zx.Allocator, props: Props) zx.Component {
    return (
        <div @allocator={allocator}>
            {props.children}
        </div>
    );
}

const zx = @import("zx");
const std = @import("std");
