State ❺πŸ§ͺ

Track, store, and apply website state for a better UX.



  • Arbitrary state definition

  • Multi-part storage

    • Ability to store some state items temporarily, others long-term

    • Secure storage options

    • Reporting options

  • Apply state

    • Set CSS vars

      • ? Subsets of custom CSS

      • ? Add global classes

    • Conditional visibility

    • Set GTM data-layer vars

    • Custom JS

      • On-load event handlers

      • On-change event handlers, per change type

    • Data-binding of state data

      • Bind to hidden form fields for submission

  • Simple setup

    • No need to define a global state object

    • However options to tag state items with specific handling rules

      • Storage, longevity, security

Storage & retrieval;

  • Local;

    • Session storage ( this session, this tab only )

    • Cookie storage ( store for specific duration )

    • Local storage ( long term )

  • Remote;

    • DB, API or KV store

    • Identity system storage

      • User Account vars

      • Memberstack vars


  • Smart as to whether state can be preserved long-term

    • i.e. for a var targeted as long-term,

Use Cases

Getting Started ( NOCODE )

STEP 1 - Add the Library

First, add the library as detailed in Quick Start.

STEP 2 - Apply wfu-decode to the HTML Embed element you want to decode

See above for details.

Last updated