Fragment Files

By default, Cull Front will produce a complete HTML when it goes thru each line in the build file. The first value of the comma-delimited line will be used as the output filename. If you give a semicolon after that filename and specify the element ID of a fragment, after that filename then Cull Front will produce ONLY that fragment. This can be used by your server to send over HTML snippets into the browser for HTMX behaviors in your application.

Here is an example:

You have a complete front end file say "index.html", which has 2 HTMX behaviors.

One behavior makes a POST request to the server and it sends back an HTML fragment (let's say "frag1") into a target element. The other one makes a GET request and sends back another HTML fragment ("frag2")

When designing index.html you describe fragments with element-ID "frag1" and "frag2" in the tree file. However these fragments are never part of the DOM tree for index.html. One can say they are orphaned. So the build.cull.txt file, you write the following lines:

"index.html","tree.txt","elems.txt","htmx.txt","alpine.txt"
"frag1.html;frag1","tree.txt","elems.txt","htmx.txt","alpine.txt"
"frag2.html;frag2","tree.txt","elems.txt","htmx.txt","alpine.txt"

When Cull Front does its work on that build file; it would first produce the complete HTML and write that into index.html ... because that was specified first in that build file. As frag1 and frag2 are "orphaned fragments" they would not be seen in the output.

Then Cull Front will write a file called "frag1.html" which contains only the fragment which starts with the element "frag1" and lastly; a file named "frag2.html" containing only the fragment starting with "frag2"

You would use frag1.html and frag2.html at your server. Thus you now have all the required files for your application to work.

In real world usage; frag1.html and frag2.html would usually not be a static piece of HTML. Instead it would usually contain some server implemented conventions so that the server can use those fragment files as server side templates (e.g. "go" templates) The server uses those server-side templates to dynamically flesh out the actual HTML; which is then returned to the client whenever those aforementioned HTMX behaviors happen. In short; Cull Front can be used to generate BOTH front end files as well as backend server-side templates.

This feature is available only from version 0.82