rsnext/errors/large-page-data.md
Ryan Parker 0a093c0e82
docs(errors/large-page-data): how to see data being passed to page (#40491)
## Summary

This PR adds a note about how to see the data that this error is complaining about:

```sh
Warning: data for page "/" is xxx which exceeds the threshold of 128 kB, this amount of data can reduce performance.
```

This debug trick was something I came across in a [discussion](https://github.com/vercel/next.js/discussions/39880) and I thought it would be helpful to others like it was for me.

## Documentation / Examples

- [ ] Make sure the linting passes by running `pnpm lint`
- [ ] The examples guidelines are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing.md#adding-examples)


Co-authored-by: JJ Kasper <22380829+ijjk@users.noreply.github.com>
2022-09-13 00:44:43 +00:00

838 B

Large Page Data

Why This Error Occurred

One of your pages includes a large amount of page data (>= 128kB). This can negatively impact performance since page data must be parsed by the client before the page is hydrated.

Possible Ways to Fix It

Reduce the amount of data returned from getStaticProps, getServerSideProps, or getInitialProps to only the essential data to render the page. The default threshold of 128kB can be configured in largePageDataBytes if absolutely necessary and the performance implications are understood.

To inspect the props passed to your page, you can inspect the below element's content in your browser devtools:

document.getElementById("__NEXT_DATA__").text