Is there such a thing as a tab storage?

[bendqh1]

I would say that the types of Web Storage that I know of are these:

1. Local Storage AKA Browser History Storage
2. Session Storage AKA Window Storage and possibly also any new window derivatized from that window

Local Storage AKA Browser History Storage will persist until the browser’s history is cleared.

Session storage or Window Storage and possibly also any new window derivatized from that window will persist as long as any relevant window stays opened.

Local Storage is an API with commands like:

localStorage.setItem('first_example', 0);
localStorage.setItem('second_example', 'A');
localStorage.getItem('first_example');
localStorage.getItem('second_example');
localStorage.removeItem('first_example');
localStorage.removeItem('second_example');
localStorage.getItem('first_example');
localStorage.getItem('second_example');
localStorage.setItem('first_example', 0);
localStorage.setItem('second_example', 'A');
console.log(localStorage);
localStorage.clear()

const letters = ['A', 'B', 'C', 'D', 'E']
localStorage.setItem('letters', letters)
localStorage.getItem('letters');
localStorage.removeItem('letters');

But is there such a thing as a tab storage? I want to store client-side data just for a relevant tab.

It doesn’t matter if the webpage changes ; as long as it’s the same tab, the same client-side data will be stored.

How can this be done?

[m_hutley]

sessionStorage and the browser.tabs object.

tabs - Mozilla | MDN

[rpkamp]

Storage isolated to a single tab is just a variable. If you want you can write some fancy wrappers to add methods like localStorage.

[m_hutley]

@rpkamp

Storage isolated to a single tab is just a variable

A variable is isolated to the page context, unless you’re talking about stuff you enter into the console.

[SamuelCalifornia]

@bendqh1

Local Storage AKA Browser History Storage

Where do you see Local Storage called Browser History Storage? Local Storage is not Browser History Storage. If you see something you think says it is then please tell us so we can explain.

Using the terms Browser History Storage and Window Storage will confuse you. You need to find the relevant documentation and use the appropriate names. I understand you cannot find the relevant documentation if you do not know the appropriate names but there is abundant documentation of Local Storage.

I know of 3 storage types for use in browsers. TheWeb SQL Database is not supported by all major browsers and it has been abandoned, therefore it is not relevant. My understanding is that the Storage API is for use by browser extensions. From my notes, it consists of simple keys and values within 3 or 4 areas, as follows.

• local: exists for the duration of an extension
• session: exists for the duration of a session
• managed: read-only data with a schema for use by administrators
• sync: supported only by Chrome; synchronizes data to and from a Google account; the same as local if no synchronization is possible

IndexedDB is for use in browsers by applications that are not extensions. Also from my notes, it persistently stores data and consists of keys and values but supports tables and indexes. All modifications are done within transactions. Mostly asynchronous.

@bendqh1

But is there such a thing as a tab storage? I want to store client-side data just for a relevant tab.

Do not think in terms of tabs. Think in terms of websites and sessions. A tab is where sessions of websites are shown. Sessions of websites can be shown in windows that are not tabs. You will not find documentation for tab storage.

Probably you want to look for IndexedDB. Note however that unless you and other users use Chrome, the data will only be available in that one computer. It can be retained for use another day but only on that computer. If you need the data to be available from multiple devices, such as both a desktop and a smartphone, then you will need cloud storage. That is not a browser thing.

[rpkamp]

@m_hutley

A variable is isolated to the page context,

But a tab contains only a single page, no?

[m_hutley]

Right, but the OP’s stated objective is:

@bendqh1

It doesn’t matter if the webpage changes ; as long as it’s the same tab,

A standard variable dies with the page change.

[SamuelCalifornia]

Also, if you use the browser’s developer tools and find the Application tab there then you can see the storage for that session or website or whatever is relevant. For most major browsers you can get the browser’s developer tools by pressing F12, except you might need to enable that in the settings. The following is a portion of what I see in the Application tab for Microsoft Edge.

There is very much more in that page, I am showing just a small portion. It is a highly realistic way to see what is available.

[rpkamp]

Ah, right.

In that case what you said before is the answer: sessionStorage and incorporate the tabId in there somewhere.

[bendqh1]

I understand you cannot find the relevant documentation if you do not know the appropriate names but there is abundant documentation of Local Storage .

Was that an insult? I’ll friendly assume just a misphrase.
I can find the relevent documentation and I can also interpret it wrongly or mistranslate it or just misphrase it.

Surely localStorage is not all browser’s history but it is part of it, that’s what I originally meant.

[SamuelCalifornia]

@bendqh1

Was that an insult?

No, it was an attempt to be understanding. I know what it is like to be so unfamiliar with something that I don’t know what to search for. The most important part of what I said was if you do not know the appropriate names.

@bendqh1

Surely localStorage is not all browser’s history but it is part of it,

I might misunderstand what you are saying. You seem to be saying that the browser’s history includes localStorage plus more. I do not know for sure but I assume they are separate. I really, really think they are separate. localStorage is for use by the website, or at least for the website. It is separate for each website. The browser’s history is for the browser to use.

I realize now that there is two types of the browser history. There is the history of pages visited in a session (that the back and forward buttons navigate) and there is a history of sites visited that is (optionally) retained for many days, perhaps months. I am not sure what terms to use to distinguish them but it does not matter. The history is separate from the storage you are asking about.

[Lemon_Juice]

Well, I also think you must have been misguided somewhere because the definitions of Local Storage and Session Storage you provided in your original post are incorrect. They are not what you think they are. The MDN documentation explains pretty well how they work.

@bendqh1

But is there such a thing as a tab storage? I want to store client-side data just for a relevant tab.

It doesn’t matter if the webpage changes ; as long as it’s the same tab, the same client-side data will be stored.

How can this be done?

If I understand you correctly then Session Storage is what you want. It will store your data in a single tab of the browser and persist across page navigation and page reloads. For security it is limited to the same domain but as long as you load into the tab pages within the same domain those pages will have access to the same data within Session Storage. Two different tabs or windows will not see each other’s data and the data will be lost when the tab or browser is closed.

[SamuelCalifornia]

@Lemon_Juice

It will store your data in a single tab of the browser and persist across page navigation and page reloads.

I hope you did not mean what you said. My interpretation of what you said is that if I go to a website and something is stored into Session Storage and then if a link is clicked and the tab goes to some other website then that other website has access to the data from the first website. I think that is not how things work and that is why the term tab can be a dangerous term for this context.

[Lemon_Juice]

@SamuelCalifornia

I hope you did not mean what you said

Actually, I meant exactly what I said but you left out the important part I wrote later that it works only for the same domain (technically speaking same origin) so that data from one website cannot be accessed by another website. Maybe the tab is not the right term but I think it’s what is perceived by a web browser user and the term used by the OP.

[SamuelCalifornia]

@Lemon_Juice

the term used by the OP.

Exactly. I think that bendqh1 misunderstood about tabs. I apologize if I am wrong but I think that the way that tabs work was misunderstood, at least in the beginning.

[dennisjn]

If you have say a genealogy web app that has an editor and a reader then it can be designed as a single app ,~/familyHistory.html or as two apps on the same domain, ~/editor.html and ~/reader.html.
All the localStorage used in the editor is available in the reader and vica versa.
They only need to be served from the same doman.
The localStorage persists in the browser, but not between browsers.
There is "shared storage, in Chrome tag least, but I have never had to deal with it, but it may be what you want.