State management (Query/Cookie/Session/Local)

A practical guide to App Connect storage strategy in Wappler, comparing URL state, cookies, session storage, and local storage through real UI scenarios.

State management in App Connect

This tour gives you a practical storage decision framework instead of four disconnected components. You will compare URL-based state with browser storage options, understand what each one is best at, and connect that choice back to the App Connect actions you actually configure in Wappler.

What you’ll learn

Instead of memorizing four components separately, you will learn the decision logic behind them: which storage belongs to shareable links, which one survives restarts, which one stays tab-scoped, and how each option feeds bindings and actions on the page.

Decide quickly

URL vs cookie vs session vs local.

Use the right actions

set/remove/removeAll (and related).

Connect to UI

Bind controls and render based on state.

Shareable state (URL)

Persistent state (cookie/local)

Temporary state (session)

Where you’ll work in Wappler

These components are configured like any other App Connect component: select in App Structure, set properties, then call actions from events.

Pick the right storage

Use this mental model to avoid accidental UX bugs (state that resets when it shouldn’t, or sticks when it shouldn’t).

URL state: Query Manager

Best when state should be shareable and bookmarkable (filters/search/sort/page/selection).

Shareable

Bookmarkable URL reflects current view.

Great for lists

Search, filters, paging, and sorting.

Type conversion

Remember query values are strings.

Search term in URL

Filter choices in URL

Page number in URL

Best for lightweight preferences and consent flags that should persist across sessions.

Preferences

Theme/language/dismissed banners.

Expires support

Set long-lived cookies when needed.

Small payloads

Keep values small and simple.

Persist across restarts

Optionally set expiration

Avoid sensitive data

Temporary state: Session Manager

Best for per-tab workflows (wizards, temporary drafts) that should survive refresh but clear when the tab closes.

Per-tab

Doesn’t leak across tabs.

Great for wizards

Store step data until submit.

Objects supported

Stores objects via serialization.

Survives refresh

Clears on tab close

Good for multi-step flows

Persistent settings: Local Manager

Best for non-sensitive settings that should “stick” without cookie overhead.

Persistent

Survives browser restarts until cleared.

Objects supported

Stores objects via serialization.

Non-sensitive only

Readable by client-side code.

Great for UI settings

Provide a reset action

Don’t store secrets

Wrap-up

Now pick a deep dive for the storage type you need.

Next steps

Choose a focused tour to continue.