data-boost

Turn same-origin links and forms into morphed navigations (htmx’s hx-boost). Clicking a link fetches the page with @get, submitting a form sends it with @post or @get, and the full-document response is morphed into the current page: <head> and <body> update in place, elements with matching ids keep their state, a history entry is pushed and the window scrolls to the top.

Syntax

<body data-boost>
<nav data-boost>…</nav>

part
key	forbidden
value	forbidden

What is boosted

rules, not a live navigation

This box cannot navigate the documentation page you are reading, so the rules are listed instead.

element	request
<a href> to the same origin	@get(href); once the page has arrived, history.pushState with the final URL (redirects followed)
<form method="post">	@post(action, { contentType: 'form' }) with the form's fields
<form> (GET)	@get(action, { contentType: 'form' }): fields go into the query string, and into the pushed URL
a submit button with formaction / formmethod	the button's values win over the form's
Back and Forward	@get(location.href), morphed again; a hash-only change fetches nothing

Left to the browser: links with target or download, clicks with a modifier key or a non-primary button, other origins, hash-only changes on the current page, and forms with a target.

Typical page

<body data-boost>
  <nav><a href="/">Home</a> <a href="/about">About</a></nav>
  <main id="main">…</main>
  <audio id="player" controls src="/song.mp3"></audio>
</body>

Because the morph keeps elements by id, #player keeps playing across navigations and an open menu stays open. Put ids on the parts of the layout that should survive.

Notes

Needs httpGet, httpPost and applyElements registered (all three are in the essentials preset). The server should return a complete HTML document, exactly as for a normal request; the Sigmx-Request: true header tells it the request came from sigmx if it wants to skip work. Form submissions respect novalidate and the browser’s validity checks before sending.

Register

import { boost } from 'sigmx/plugins'

Registering boost adds 569 bytes brotli (633 gzip, 1412 minified) on top of the core. See bundle sizes.