Hi, how can I know if the dom is loaded in Sveltekit with csr is set to false?

Question

I am new to Sveltekit and I am trying to figure out how to handle SSR.

I have a simple Sveltekit application with these configuration:

export const csr = false; export const ssr = true; export const prerender = true;

The main reason for this configuration is to maintain a sustainable SEO. When I set Csr to false, each page is rendered by the server loading Doc to the browser.

I also have an image component <Img> inside which there is an onMount function.

onMount(() => {
console.log('mounted',src);
if (lazyLoad) {
  const images = document.querySelectorAll('img.lazy-load');
  const observer = new IntersectionObserver((entries, observer) => {
    entries.forEach(entry => {
      if (entry.isIntersecting) {
        const image = entry.target;
        image.src = image.dataset.src;
        image.classList.remove('lazy-load');
        observer.unobserve(image);
      }
    });
  });

  images.forEach(image => {
    observer.observe(image);
  });
}});

The main problem here is that this onMount function is never called. Also, beforeUpdate, afterUpdate and if (browser) console.log("browser is true"); do not work either.

I need to find a way to check if dom is loaded while keeping csr set to false.

Main purpose is to have the best SEO, I am open to alternatives.