Hydrate warning with universal portal

Question

Some time ago I created for study purposes a universal portal (to work in SSR), very similar to this library: @jesstelford/react-portal-universal.

The whole thing about the universal portal is to collect the portal on a server without calling createPortal and then append them on the right selector.

let html = data.replace('<div id="root"></div>', <div id="root">${app}</div> );
    html = extractor.appendUniversalPortals(html);
    return res.send(html);

This is the project that I handled a custom universal portal: Stack Blitz project

The problems I can't find out are:

• Why am I facing issues (warning messages) when using @jesstelford/react-portal-universal with nextjs, but not on my project using my custom universal portal? (Stackblitz Nextjs sample)If you guys run both stackblitz samples you will see that the nextjs one have a warning log but mine doesn't.
• Why do react warn me about something present on the initial markup? It is the same element, with the same attributes.
• Is the warning just a warning and doesn't affect the hydrate or does it affect it?
• Does this library @jesstelford/react-portal-universal wrong? Does the nextjs sample wrong? Does having a portal with the initial markup a wrong idea? How can I achieve such a feature without those messages?

I tried everything, looked for issues, reproduce universal portal with custom server and with nextjs. I just want to have the portal markup and hydrate it on client, is that possible?