External images in TiddlyWiki are tiddlers that point to the URI of an image, rather than embedding the full image data. They can perform better than embedded images, particularly with large numbers or sizes of images. However, using them breaks the single file pattern of TiddlyWiki.
External images are used in the browser. They can be created by the Node.js configuration when it builds a TiddlyWiki, or they can be created manually within the browser.
An external image is an ordinary image tiddler that has a ''_canonical_uri'' field containing the URI of the image. The URI can be absolute or relative to the HTML document. If the canonical URI is provided then the ''text'' field of the tiddler is ignored and so should be omitted.
To manually create an external image just create the tiddler with the appropriate image content type, and add a ''_canonical_uri'' field with a URI pointing to the actual image location.
''IMPORTANT:'' Double-check your spelling. ``_canonical_uri`` is spelled [[URI|https://en.wikipedia.org/wiki/URI#The_relationship_between_URIs.2C_URLs.2C_and_URNs]], not URL.
The following steps are used to create a static HTML file version of a wiki accompanied by an ''images'' folder containing the referenced external images:
# Create image tiddlers in your TiddlyWikiFolders in the usual way
# Save the images as separate files (by convention, in a subfolder named ''images'')
# Externalise the image tiddlers by giving them a ''_canonical_uri'' field
# Save the main HTML file
Note the image files must be saved before they are externalised. Externalising them destroys the ''text'' field within the in-memory copy of the wiki store, meaning that attempts to save them will fail.
For an example see the ''externalimages'' build target of the demo ''tw5.com'' wiki:
Two `--setfield` commands are used: the first sets the ''_canonical_uri'' field to a URI derived from the title of the tiddler, and the second clears the text field.
