php kullanıyorsan session ile saklayarak yönetebilirsin,ama en mantıklısı id referansı olarak db'de yeni bir kolon açıp db isteklerinde id referansına göre filtreler vs yapabilirsin

setInterval'i clearInterval ile sonlandırabilirsin. Örnek olarak

let interval = setInterval(callback,time) //setIntervalin son id'sini interval adli değişkene atadık.

clearInterval(interval) //clearInterval senden setInterval'in son id'sini istiyor.Onu verdiğinde durdurabilirsin.

httpOnly cookie'sini browserda yani clientta görüntüleyemezsin. Sadece backend'de bunu yakalayabilir veya erişebilirsin bunun içinde backendinin cookie ayarlarının açık olması gerek.

Envato'nun urlsini baz alarak anlatacağım çünkü bende öyle bir yapı kullanıyorum.

const url = "nody-react-react-js-landing-page-template-N2JTWYQ"
const urlToArr = url.split("-")
const id = urlToArr.at(-1)
const slug = urlToArr.slice(0,-1).join("-")

const product = await fetch(id) //Burada id'e göre ürünü getirdik 

if([product.slug,product.id].join("-") !== url){
  // Eğer bu koşula giriyorsa kullanıcı yanlış slugda
  navigate([product.slug,product.id].join("-")) // olması istenilen url'e kullanıcıyı yönlendirdik
}

// Burada ise slug ve id doğru kısımdadır demektir , işlemlerine devam edebilirsin

Yukarıda verdiğim örnekte değişken isimleri vs kendine göre düzenlemen gerek. Mantığını anlatmaya çalıştım

İlk öncelikle araştırman gereken ssh bilgilerini veren bir hosting bulman gerek.
Ssh bilgileri bilgisayara uzaktan bağlantı kurmanı sağlayan bilgileridir.Bunun temel sebebi hosting'e nodejs kurman gerek. Nodejs kurduktan sonra dosyalarını ftp ile atacaksın. Ssh ile sunucuna bağlanarak attığın dosyaların dizinine gidip package.json olan dizinde gerekli paketlerini kur. PM2 paketini de kur. Bu paket senin yerine bir nodejs uygulaması çalıştırıp saklı tutacaktır. PM2 ile nodejs uygulamanı çalıştır ve bitti

Ssr sadece verinin client'a iletme kısmında çalışır. Client kısımda hook ile en üste çıkmasını sağlayabilirsin.

useEffect(() => {
    router.events.on("routeChangeComplete", () => {
      console.log("route change routeChangeComplete");
      if(typeof window !== "undefined")
          window.scrollTo({ top:0 });
      
    });
    return () => {
      router.events.off("routeChangeComplete", () => {
        console.log("stoped");
      });
    };
  }, [router.events]);

Bu kodu app.js ' e koyarsan her bir route değişimini kontrol edebilirsin. Her route değişiminde en üste scrollarsın

Global state yönetimi tamamen projenle alakalı şeylerdir.Ben genelde küçük - orta çaplı projelerde Zustand , büyük çaplı projede redux kullanma taraftarıyım. Context ise parent componentin state'ını childrenlara vermek için kullanıyorum. Örnek dropdown componenti
Not:Context global state için hiç sağlıklı ve uygun değildir.

pages'in içindeki app.js 'i Suspense ile kaplayıp dener misin

Opengraph tagları Html içerisinde gömülü bir şekilde olması gerek. Helmet bunu javascript ile yapıyor.Yani kısaca server side render yapman gerek.

Çözümler
-next.js ' e geçebilirsin
-public'in içindeki index.html içerisine kendin meta taglarını her sayfa için aynı gözükecek şekilde eklemen

eval back-end'de çalışan bir kod değildir. Zaten bu açıklar client tarafda oluşması muhtemel sorunlardır. Yani kullanıcının gördüğü html sayfasını (client'ı) manipüle etmesidir olay. Backend'e müdahele söz konusu bile olamaz (sunucuna sızmazsa).