Manually call sheet.seal() to avoid memory leaks on with-styled-components example (#6107)

I was noticing some bad memory leak on my company's application and I ended up finding this github issue ( styled-components/styled-components#1624 ) .

This comment ( styled-components/styled-components#1624 (comment) ) caught my attention, which lead to this other issue on the repository of styled components website ( styled-components/styled-components-website#329 )

After applying the changes on my project I noticed a huge improvement on memory consumption.

So would be nice to update the example or start a discussion on how to solve this properly

Author: lucasfeliciano

examples/with-styled-components/pages/_document.js

@@ -4,17 +4,21 @@ import { ServerStyleSheet } from 'styled-components'
 export default class MyDocument extends Document {
   static async getInitialProps (ctx) {
     const sheet = new ServerStyleSheet()
-
     const originalRenderPage = ctx.renderPage
-    ctx.renderPage = () =>
-      originalRenderPage({
-        enhanceApp: App => props => sheet.collectStyles(<App {...props} />)
-      })
 
-    const initialProps = await Document.getInitialProps(ctx)
-    return {
-      ...initialProps,
-      styles: [...initialProps.styles, ...sheet.getStyleElement()]
+    try {
+      ctx.renderPage = () =>
+        originalRenderPage({
+          enhanceApp: App => props => sheet.collectStyles(<App {...props} />)
+        })
+
+      const initialProps = await Document.getInitialProps(ctx)
+      return {
+        ...initialProps,
+        styles: [...initialProps.styles, ...sheet.getStyleElement()]
+      }
+    } finally {
+      sheet.seal()
     }
   }
 }