Backends
Turbo, htmx and friends
Stickybeak follows path-changing navigation from Turbo, htmx, Livewire, Inertia, LiveView and Blazor without extra page-view code.
What counts
A first load, history.pushState to a different path, and Back or Forward between paths count. Query-only changes, replaceState and updates that leave the address alone do not.
| Library | Counted | Not counted |
|---|---|---|
| Turbo / Turbolinks | Different-path visits; Back/Forward | replace, query-only changes, ordinary Frames |
| htmx | Path-changing boosted links and hx-push-url | hx-replace-url, address-free swaps |
| Livewire | Path-changing wire:navigate | Component and query-only updates |
| Inertia | Different-path visits | Same URL, replace: true, preserveUrl |
| LiveView | Path-changing navigate, patch and push variants | replace: true, query-only patches |
| Blazor | Enhanced navigation to a different path | Same-path updates |
Keep one identical Stickybeak tag in <head>; partial-navigation libraries preserve it.
Goals and custom events in partial updates
data-goal works in swapped content. For server-confirmed goals, avoid body scripts that a page cache may replay:
- Redirects: render a session-flash call in
<head>. - Livewire: use
$this->js(). - Inertia: use flash data and
router.on("flash"). - LiveView: use
push_event. - htmx: send an
HX-Triggerresponse header.
HX-Trigger: {"stickybeak": {"name": "signup", "props": {"plan": "pro"}}}<script>
document.addEventListener("stickybeak", function (event) {
window.stickybeak(event.detail.name, event.detail.props);
});
</script>Build the header with your language’s JSON encoder. See Custom goals and Single-page apps.