Skip to content

Feature: Flow Fast-Forward ("Content-Aware First")

Related: JumpTo Operator -- shares infrastructure (emitProgression, target palette) GitHub: #1853 Implementation plan: Application-Frontend/docs/superpowers/plans/2026-04-17-jumpto-and-flow-fastforward.md

Overview

A new mode alongside the existing "first" (startingComponent). Currently, setting "first" on an operator skips everything before it -- including CSS changes, JS operations, ShowHide states, and all accumulated state. The new mode fast-forwards through the flow instantly, applying all state changes without showing them.

The user's words: "I want it to acknowledge that it happened, I just don't want to see it happen."

Problem

When "first" is set later in a flow, elements that depend on prior CSS/JS/ShowHide operations are in the wrong state:

  • A background element animated into frame via CSS early in the flow is still out-of-frame
  • ShowHide states haven't been toggled
  • ChangeText/ChangeImage overrides haven't been applied
  • Variable assignments haven't run

Desired Behavior

Two distinct modes when "first" is set:

ModeBehavior
Fresh Start (current)Jump to operator, ignore everything before. Clean slate.
Content-Aware (new)Fast-forward from step 1 to the "first" operator. Execute all functional operators (CSS, JS, ShowHide, Change*, SetVariable) instantly. Skip delays. Auto-resolve choices. Land on the "first" operator with all prior state accumulated.

How It Works

1. Pathfinding

The flow is a directed graph with branching at Choice operators. To fast-forward, we need to find a path from step 1 to the target step. BFS (breadth-first search) finds the shortest path. When a Choice operator is on the path, the fast-forward engine auto-selects the answer that leads toward the target.

2. State Accumulation

Along the path, each operator is handled:

Operator TypeFast-Forward Behavior
CSSExecute normally (inject styles)
JS/TagExecute normally
ShowHideExecute normally (toggle visibility)
Change* (Text, Image, Video, Url)Execute normally (apply overrides)
SetVariableExecute normally
DelaySkip entirely (duration = 0)
RestartSkip (would cause loop)
JumpToSkip (would cause loop)
Visual (Message, Choice, Image, etc.)Skip (don't render to liveFlow)

3. Landing

After fast-forward completes, the flow begins normal execution from the target operator. All state is in place as if the user had clicked through the flow manually.

4. Performance

Fast-forward is synchronous for most operators (CSS, ShowHide, Change* are already sync). The only potential latency is if a JS/Tag operator does async work (e.g., fetch), but this is rare. In practice, fast-forward should be near-instant for most flows.

For complex flows with many operators, a brief loading indicator may be shown.

Key Files

Engine (Creative-Engine)

  • Create: src/logic-system/processors/flowFastForward.ts -- pathfinding + operator replay
  • Modify: src/logic-system/processors/conversationFlow.ts -- integrate fast-forward on startflow
  • Modify: src/services/dataStore.ts -- add fastForwardTarget reactive ref

Frontend (Application-Frontend)

  • Modify: src/pages/Chatbots/components/CavaiFlow/CavaiFlow.vue -- UI toggle for first mode
  • Modify: src/pages/Chatbots/components/CavaiFlow/DataHelper.ts -- include all operators in step mapping when content-aware

Composer (Creative-Composer)

  • Modify: src/remapper/computeComponents.ts -- pass fastForwardTarget metadata

Naming (Undecided)

The toggle appears when an operator is marked as "first". Options:

  • "Content-Aware" / "Fresh Start"
  • "With History" / "Clean Start"
  • "Resume State" / "Skip"
  • A checkbox: "Apply prior state"

Open Questions

  1. Choice resolution strategy: When multiple paths exist through choices, take shortest (BFS default)? Always take position 1? Let user specify?
  2. OnEvent compatibility: When OnEvent operators are implemented, fast-forward will need to register their listeners. Not blocking for v1.
  3. Fallback: If pathfinding fails (disconnected graph), fall back to fresh start silently or warn the user?

Origin

Feature request from Cecilie (2026-04-17). Not high priority but very annoying when relevant (lots of CSS changes before "first").

Internal documentation