Hello.
When configuring styles in SSR in Next.js, I encountered a problem.
After hydrating the styles - the client also inserts its own <style> tags. This results in duplication of styles.
As there is no SSR documentation yet, I implemented using the source code.
Screenshot: 
static async getInitialProps(ctx) {
const originalRenderPage = ctx.renderPage;
const renderer = createDOMRenderer();
ctx.renderPage = () =>
originalRenderPage({
enhanceApp: (App) => {
return function EnhancedApp(props) {
return (
<RendererProvider renderer={renderer}>
<App {...props} />
</RendererProvider>
);
};
}
});
const documentProps = await NextDocument.getInitialProps(ctx);
documentProps.styles = (
<>
{documentProps.styles}
{renderToStyleElements(renderer)}
</>
);
return documentProps;
}Reproduced the problem in CodeSandbox.
Maybe this is not a bug and there is a way to disable client initialisation of already hydrated elements
Hello.
When configuring styles in SSR in Next.js, I encountered a problem.
After hydrating the styles - the client also inserts its own
<style>tags. This results in duplication of styles.As there is no SSR documentation yet, I implemented using the source code.
Screenshot:
Reproduced the problem in CodeSandbox.
Maybe this is not a bug and there is a way to disable client initialisation of already hydrated elements