LocalStorage is a kind of browser memory enabling data, in the form of variables with content, to be retained for as long as you wish, even if you close your browser, or the tab containing your web page, or even turn off your computer. In the next session when you open the same web page, the data is available again. Very useful!

WebProg3 uses LocalStorage extensively. However, no data is retained by WP3 between sessions. When the app starts up, the first thing it does is to clear down the LocalStorage for its domain completely. This is because the memory available for the domain of any given web page is extremely limited, and it is necessary to make sure that space is available to store what it needs before attempting to use it.

There is also a related kind of browser memory called "SessionStorage" that operates identically to LocalStorage. The only difference is that data is not retained between user sessions, i.e. it disappears as soon as the tab containing the web page is closed. So if WP3 does not retain data for its domain when it is closed, why use LocalStorage rather than SessionStorage? No reason really. LocalStorage can be very simply cleared down whenever you want anyway, so it makes no difference.

How does webProg3 use LocalStorage then? WebProg3 is highly modularised. Not only does it make use of a great number of external JS files (providing extensions to the main script), but it also opens up new web pages in separate browser tabs. The Colour Chooser, Picture Chooser and Rich Text Editor are examples. When the data has been obtained from one of these separate modules, it has to transfer it back to the main page for display on the grid, and the main page has to monitor this process and be ready to receive the data as soon as it is made available. On occasions, WP3 also uses WebStorage to exchange variables with its external JS scripts. Although strictly speaking this should never be necessary, there are times when it is more convenient and reliable to use LocalStorage variables rather than normal ones.

For your interest, here's how you can set and retrieve variables in local storage:

localStorage.setItem("myVariable", "value");
myVariable = localStorage.getItem("myVariable");

And here's how you can remove a variable:

localStorage.removeItem("myVariable");

Quite easy really. Here's another example of setting a variable:

localStorage.setItem("userName", "Bob Warren");

However, the kind of data that WP3 stores in a single variable is far beyond a little "Bob Warren", it can be for example several MB of picture data encoded (like text) in base64! And if the picture is too big, this can even cause the browser to go on strike, so watch out! When such things happen, and you cannot work out what is happening, it is worth looking in your browser's diagnostics to see if anything has been declared. Much to your horror, you might see something like this:

Apart from your browser going on strike because it considers that you have used too much of the memory it thinks you should have, glitches while you are working with WP3 are rare, but they can happen of course. Also, when you are trying to load up webProg3 by navigating to the website, the browser might fail to display the program's main screen adequately, and God only knows the reason. It could be a temporary/brief problem on the Internet, or the website itself, or ...........?? What I do know and can tell you is that the browser's cache is a bit of a headache. This is where it stores stuff that you have downloaded previously, such as images and other data, and it does that so that it won't need to download it again, thus achieving greater speed. Of course, nowadays, with a much faster Internet, the employment of a cache is far less imperative than it was in the past. And what I can also tell you is that if you clear down the browser's cache manually, lo and behold your web page is 99% guaranteed to load properly straight away! I'll leave you to draw your own conclusions from that fact. If you suffer some kind of glitch during your work with WP3, but it is still running, it's not a bad idea to begin by clearing down WebStorage for the domain, and you can do that by clicking on the icon provided at the top of the main screen on the right. Afterwards, clear out the browser's cache.

For details on clearing out the browser's cache, please see section 14 of this Help.

So the message is, try not to be as crazy as I needed to be in building WP3!

When you come to use LocalStorage, be as modest over the size of things as you can possibly be.

And when you are using WP3 to build your web pages, especially when introducing pictures that occupy a lot of space, don't make them any bigger than necessary!