mirror of
https://github.com/terribleplan/next.js.git
synced 2024-01-19 02:48:18 +00:00
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 ( https://github.com/styled-components/styled-components/issues/1624 ) . This comment ( https://github.com/styled-components/styled-components/issues/1624#issuecomment-425382979 ) caught my attention, which lead to this other issue on the repository of styled components website ( https://github.com/styled-components/styled-components-website/issues/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
This commit is contained in:
parent
9112f63eba
commit
ca521b36e6
|
@ -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()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue