Module: lib/core/renderer/program/CompiledTemplate

The parsed, reusable form of a render program's skeleton.

The cost this removes

The string renderer parsed HTML on every update of every component. A skeleton is parsed once per component class, for the life of the page, and every instance after the first is a cloneNode(true) of that parse. Cloning a tree is a native operation with no tokeniser, no attribute parsing and no error recovery; parsing the same markup a second time is all three.

Resolving markers, once

The compiler emits markers rather than index paths because it cannot predict what the HTML parser will do with a template (implied <tbody>, relocated content, tags closed for the author). So the first thing this class does is find the markers in the tree the parser actually built, and record where they ended up as index paths.

After that first walk the markers are gone -- data-axb is removed from the prototype tree and each <!--axt:n--> comment is replaced by the empty text node that will hold the value. Every clone therefore comes out already shaped, and every instance resolves its binding targets by walking a handful of child indices rather than searching the tree.

The result is that a 2000-node component costs one parse and one marker walk ever, plus one clone and ops.length short index walks per instance.

Source:

Classes

CompiledTemplate

Members

(inner, constant) ELEMENT_MARKER :string

Attribute identifying a bound element in a freshly parsed skeleton.

Type:
  • string
Source:

(inner, constant) TEXT_MARKER :string

Prefix identifying a text marker comment.

Type:
  • string
Source:

(inner, constant) cache :WeakMap:.<object:, CompiledTemplate:>

Caches one CompiledTemplate per program.

Keyed by the program object itself, which the compiler emits once per component class into the bundle, so every instance of a class shares one parse without the cache needing to hash the markup.

Type:
  • WeakMap:.<object:, CompiledTemplate:>
Source:

Methods

(static) getCompiledTemplate(program) → {CompiledTemplate}

Returns the prepared template for a program, preparing it on first use.

Parameters:
Name Type Description
program object

A render program.
Source:
Returns:

The prepared template.

Type
CompiledTemplate

(inner) parseSkeleton(html) → {DocumentFragment|null}

Parses a skeleton into a reusable prototype fragment.

<template> is used rather than DOMParser because template parsing is fragment parsing: content that a document parser would relocate or discard (a bare <td>, a <tr> outside a table) survives inside a template. The string renderer's use of DOMParser and document.body is the reason table fragments have historically needed care.

Parameters:
Name Type Description
html string

The skeleton markup.
Source:
Returns:

The parsed content, or null when the host provides no usable DOM.

Type
DocumentFragment | null

(inner) resolvePath(root, path) → {Node|null}

Follows an index path from a root node.

Parameters:
Name Type Description
root Node

The starting node.
path Array:.<number:>

Child indices to follow.
Source:
Returns:

The addressed node.

Type
Node | null