This likely won’t be relevant to a lot of devs here, because the remember plugin does the job fine in most cases, but:

Here’s a normal text input (id is not needed for this example, but is almost always needed so adding it here):

<input id="thingyInput">

And here’s one which remembers what you type into it even after page refresh:

<input id="thingyInput" oninput="localStorage.thingy=this.value" value="[localStorage.thingy || '']">

Of course, the remember-plugin can do this for you, but I often find myself reaching for the above pattern for its simplicity.

localStorage is what the remember-plugin uses behind the scenes - whatever you store in it will be persisted even after page refresh. It’s a built-in browser/JavaScript feature - not something that’s specific to Perchance.

The || '' in [localStorage.thingy || ''] means or ''. In other words, it means or output nothing. If you want a default value for when the user loads the page for the first time, you could write [localStorage.thingy || 'blah'] which means “use whatever is in localStorage.thingy if it exists, otherwise use ‘blah’”

  • BluePower
    link
    fedilink
    English
    14 months ago

    Quick question on this topic… is localStorage “safe”?

    The localStorage is contained inside each generator, meaning that values set from one generator can only be accessible from that generator (like not tied within the localStorage from the entire Perchance website), so it is safe. Basically, every generator has its own localStorage container, and there’s an explanation to why.

    • @wthit56
      link
      English
      14 months ago

      Ooooh, okay. So secretly they’re running from their own subdomain, and subdomains have their own localStorage I think. Great 👍