Canonical Tag for dynamic subsites with nearly the same frame (navbar and sidebars)

Question

I have a JS-based dynamic website which is built the following way:

• On the server side the index.html contains the "frame" of the website: the navbar and the sidebars.
• After loading it, the inline JS-call dynamically fills the content part, generates the content on the client side.
• I have multiple (70+) subsites where the "frame" is nearly identical, only the links and some text are different (and of course the titles).

Just to be able to "see it" somehow:

• Main page https://example.com

• Title: Home Page

• Link1: https://example.com/site-1

• Link2: https://example.com/site-2

• Link3: https://example.com/category-1

• Link4: https://example.com/category-2

• Subsite for Site 1 https://example.com/site-1

• Title: Site 1 | Example.com

• Link1: https://example.com/site-1

• Link2: https://example.com/site-2

• Link3: https://example.com/site-1/category-1

• Link4: https://example.com/site-1/category-2

• Subsite for Category 1 https://example.com/category-1

• Title: Category 1 | Example.com

• Link1: https://example.com/site-1/category-1

• Link2: https://example.com/site-2/category-1

• Link3: https://example.com/category-1

• Link4: https://example.com/category-2

So basically that's all the differences between the server-side content (what Google can index for sure) for the main page and subsites (for sites and categories). So 97% the same. Only after the loading the content part with JS will the difference come - but Google doesn't really load it, or not always. So as Google sees these 70+ sites, they are probably the same.

The question: Do I have to use Canonical Tag for the main site and the subsites as well? I ask it, because Google doesn't really want to index the subsites, I still can see only the main site indexed. And I don't know if the reason behind it is maybe that on the server side all index.html files (of the main page and all the subpages) are nearly identical. And I can't find any other suggestions, just to include the Canonical Tag on all sites. Just like:

All pages (including the canonical page) should contain a canonical tag to prevent any possible duplication. Even if there are no other versions of a page, then that page should still include a canonical tag that links to itself.

A self-referential canonical tag is a tag that is defined on the main version of the page; irrespective of duplicate pages elsewhere. This means, even if your page does not have other similar pages with duplicate content, you still put a canonical tag on that page. This is also known as self canonical.

All the subsites are listed in the sitemap.xml, but they are not indexed. And I'm searching for solution, that's how I found the Canonical Tag as possible solution. Hopefully.

Thank you.