How do websites show “help” blocks until the user clicks X to not to see them again

Clash Royale CLAN TAG#URR8PPP
How do websites show “help” blocks until the user clicks X to not to see them again
On some web sites you visit, they'll provide instructions or help or count how many times you've dismissed a help/insight. Are they typically done with a cookie, updating a database record for the user's profile or what?
The web app I'm working on has a bulleted list of steps to perform. The client is asking for that to be dismissable rather than collapsible as it is now (the user has to minimize it every time they hit the page). Normally I'd just update the user's profile where a column might be showHelpText with a bit value.
showHelpText
Since this is a per page setting, I'm thinking of creating a mapping table that I can query searching for cgi.script_name (Adobe CGI Server Variables) and the userID. If a record exists, don't show the help. If no records found, show the help text. Is there a more efficient way to accomplish this. Cookies are out since the user could be using different devices/pc/tablets/etc. Showing the help again is not a part of this request.
cgi.script_name
userID
1 Answer
1
I think that in this situation i'd would do use the local storage api and add a field to the user record in the db called 'ui_preferences' which would be a copy of local storage value, on load if the value doesn't exist you could fetch it, allowing the values to propagate between devices.
Psuedo Js;
someCustomObject.savePreferences(uiPreferences);
/* somewhere in the method call: */
var uiPreferences = 'helpDialog':'pageNameHere': true;
localStorage.setItem('uiPreferences', JSON.stringify(uiPreferences));
So the when the page loads you could go;
var uiPreference = someCustomObject.getPreference('somepreference');
Which could check local storage for the preference, and if it doesn't exists ping the server for it. You custom js object could deal with default values, meaning you don't need a fixed schema for the preferences. Seeing as local storage is effectively just a key value store you would only ever need one column in the db to store a large-ish text field.
data stored in localStorage has no expiration time
dismiss forever
Ah, wait, the db would come into play to ensure the user's ui_preference is delivered from device to device, right?
– HPWD
Aug 6 at 17:27
That is one solution; you would only record back to the server when something changed, and when they re-access the site you could resync with the db when you need to. Like I said, you'd only need one text column to store the serialized string, you could use a file on the server, or any other persistence solution that takes your fancy. Once you start talking about syncing preferences from device to device you'd need some server level persistence.
– Dpolehonski
Aug 7 at 7:32
By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.
I've never had a need to access local storage and didn't know
data stored in localStorage has no expiration time. This is very interesting. So just to echo back my understanding, the user clicks thedismiss foreverbutton. The listener responds but setting the localstore ui_preference value. The next time the user accesses the page, the page checks for the ui_preference in localStorage and doesn't display the help block again. I'm not clear then why the db would be needed. Can you elaborate on this aspect?– HPWD
Aug 6 at 17:26