Determine when a page is refreshed or reloaded

Question

I have read several StackOverflow answers about refreshing and/or reloading a page and how to determine.

Check if page gets reloaded or refreshed in JavaScript

and

Check if page gets reloaded or refreshed in JavaScript

in particular. Both of these questions have answers that appear to answer the question, how to determine when a page is refreshed or reloaded.
The problem is that the referenced PerformanceNavigation API appears to be deprecated and the New PerformanceNavigationTiming API looks like it is still not ready for production use.

I have tried using the old interface and the new interface. The OLD PerformanceNavigation works in Chrome, Firefox, and Edge.

The NEW PerformanceNavigationTiming does NOT seem to work in any of these browsers.

Here is the code is used from 1 of the questions I referenced.

if (window.PerformanceNavigation) {
    console.info("window.performance works fine on this browser");
}

if (window.PerformanceNavigationTiming) {
    console.info("window.performance works fine on this browser");
}

if (window.performance.navigation.type == "reload" ||      window.performance.navigation.type == 1) {
   console.info( "This page is reloaded" );
} else {
   console.info( "This page is not reloaded");
// console.info( "Value of Type is: " + window.PerformanceNavigationTiming.type()); 
}

if (window.PerformanceNavigationTiming.type == "reload" || window.PerformanceNavigationTiming.type == 1) {
    console.info( "This page is reloaded" );
} else {
    console.info( "This page is not reloaded");
// console.info( "Value of Type is: " + window.PerformanceNavigationTiming.type()); 
}

I really don't want to use deprecated API's for obvious reasons. But I see no way around dealing with this problem. Hoping for a really simple way to deal with this.
So, my questions are:

1. Isn't the New Interface supposed to work when the old one is deprecated?

2. What did I do wrong trying to use the New Interface if it does work. I admit it could be me and lack of experience.

3. Any simple examples you can provide are appreciated.

Meow

So what, precisely, is the question? – Cabriole

Also, why do you need to know if they page was refreshed? Maybe there's a better solution to the original problem? – Plumbiferous

Sorry, that was really dumb of me. The questions are: 1. Isn't the New Interface supposed to work when the old one is deprecated? 2. What did I do wrong trying to use the New Interface if it does work. I admit it could be me. – Meow

Chris G. If the page is refreshed, I lose some variables that I need to reset when the refresh happens. If I can get the New interface to work that solves my problem in determining whether to reset those variables or not. Thanks. – Meow

Please edit the question to add your questions, don't leave them in comments. ;-) – Cabriole

you should use php sessions variables, javascript is not the best language to do this, you an also try to add cookies as a variable but it's not the best way to solve – Mikkel

There is localStorage/sessionStorage and indexedDB as well for storing data across reloads. – Jacy

Does this answer your question? Determining navigation type from PerformanceNavigationTiming – Volute

Answer 1

window.performance.navigation. replaced with window.performance.getEntriesByType("navigation")

Try the snippet below to solve your issue

if (window.performance.getEntriesByType) {
    if (window.performance.getEntriesByType("navigation")[0].type === "reload") {
        alert('reloaded')
    }
}

Apophasis