How to use the @glimmer/program.artifacts function in @glimmer/program

static _renderComponent(name: string, cursor: Cursor, compilable: number, data: {}): ElementNode {
        let state = State(data);
        const artifact = artifacts(Application.context);
        const runtime = AotRuntime(Application.document as any, artifact, Application.resolver);
        let iterator = renderAot(runtime, compilable, cursor, state);
        // const treeBuilder = NewElementBuilder.forInitialRender(runtime.env, cursor);
        // let iterator = renderAotMain(runtime, state, treeBuilder, compilable);
        try {
            const result = renderSync(runtime.env, iterator);
            console.log(`Component ${name} Rendered`);
            let node = result.firstNode() as any;
            while (!node._nativeView) {
                node = node.nextSibling;
            }
            node.meta.component = new NativeComponentResult(name, result, state, runtime);
            return node as any;
        } catch (error) {
            console.log(`Error rendering component ${name}: ${error}`);
        }

static _renderComponent(name, cursor, compilable, data) {
        let state = State(data);
        const artifact = artifacts(Application.context);
        const runtime = AotRuntime(Application.document, artifact, Application.resolver);
        let iterator = renderAot(runtime, compilable, cursor, state);
        // const treeBuilder = NewElementBuilder.forInitialRender(runtime.env, cursor);
        // let iterator = renderAotMain(runtime, state, treeBuilder, compilable);
        try {
            const result = renderSync(runtime.env, iterator);
            console.log(`Component ${name} Rendered`);
            let node = result.firstNode();
            while (node && !node._nativeElement) {
                node = node.nextSibling;
            }
            const component = new NativeComponentResult(name, result, state, runtime);
            if (!Application.currentPageNode.listViewItems) {
                Application.currentPageNode.listViewItems = [];
            }
            Application.currentPageNode.listViewItems.push({ component, cursor });

static _renderPage(name, containerElement, nextSibling, compilable, data = {}) {
        let state = State(data);
        const artifact = artifacts(Application.context);
        Application.aotRuntime = AotRuntime(Application.document, artifact, Application.resolver);
        const cursor = { element: containerElement ? containerElement : Application.rootFrame, nextSibling };
        let iterator = renderAot(Application.aotRuntime, compilable, cursor, state);
        try {
            const result = renderSync(Application.aotRuntime.env, iterator);
            console.log(`Page ${name} Rendered`);
            Application.result = result;
            Application._rendered = true;
            let node = result.firstNode();
            while (node && !node._nativeElement) {
                node = node.nextSibling;
            }
            // (node as PageElement).parentNode = containerElement;
            Application.currentPageNode = node;
            Application.currentPageNode.listViewItems = [];
            // containerElement.childNodes.push(node);

static _renderPage(name, containerElement, nextSibling, compilable, data = {}): ElementNode {
        let state = State(data);
        const artifact = artifacts(Application.context);
        Application.aotRuntime = AotRuntime(Application.document as any, artifact, Application.resolver);
        const cursor = { element: containerElement ? containerElement : Application.rootFrame, nextSibling };
        let iterator = renderAot(Application.aotRuntime, compilable, cursor, state);
        try {
            const result = renderSync(Application.aotRuntime.env, iterator);
            console.log(`Page ${name} Rendered`);
            Application.result = result;
            Application._rendered = true;
            let node = result.firstNode() as any;
            while (!node._nativeView) {
                node = node.nextSibling;
            }
            node._meta.component = new NativeComponentResult(name, result, state, Application.aotRuntime);
            return node as any;
        } catch (error) {
            console.log(`Error rendering page ${name}: ${error}`);

@suffix={{this.suffix}}
      @num={{this.num}}
    />
  {{~/let~}}
`;

let main = compile(mainSource);

/**
 * Finalize the program, getting back the compilation artifacts:
 *
 * - the serialized program, containing all of the compiled opcodes
 * - the constant pool, mostly used for storing strings
 */

let payload = artifacts(context);

/**
 * Glimmer's internals are restricted to using a small subset of DOM
 * called Simple DOM. In a browser, you can use the normal DOM, but
 * since we're in Node, we can use the simple-dom package for rendering.
 *
 * Unlike JSDOM, simple-dom doesn't attempt to emulate the entire
 * surface of the DOM, focusing instead on the DOM as a data structure.
 * This also makes it ideal for server-side rendering, and it is, in
 * fact, used in Ember's SSR solution, FastBoot.
 *
 * The entire interface definition is at:
 * https://github.com/ember-fastboot/simple-dom/blob/master/packages/%40simple-dom/interface/index.d.ts
 */

let document = createHTMLDocument();

{{~/let~}}
`;
let main = context_1.compile(mainSource);
/**
 * Finalize the program, getting back the compilation artifacts:
 *
 * - the serialized program, containing all of the compiled opcodes
 * - the constant pool, mostly used for storing strings
 */
let payload = program_1.artifacts(context_1.context);
/**
 * Glimmer's internals are restricted to using a small subset of DOM
 * called Simple DOM. In a browser, you can use the normal DOM, but
 * since we're in Node, we can use the simple-dom package for rendering.
 *
 * Unlike JSDOM, simple-dom doesn't attempt to emulate the entire
 * surface of the DOM, focusing instead on the DOM as a data structure.
 * This also makes it ideal for server-side rendering, and it is, in
 * fact, used in Ember's SSR solution, FastBoot.
 *
 * The entire interface definition is at:
 * https://github.com/ember-fastboot/simple-dom/blob/master/packages/%40simple-dom/interface/index.d.ts
 */
let document = document_1.default();
/**
 * Now we're going to execute the module that we compiled, so we need