Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Re-render details if rewrites are used #34049

Merged
merged 5 commits into from Feb 10, 2022
Merged

Re-render details if rewrites are used #34049

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
3704ff2
Add details about using rewrites
MaedahBatool Feb 7, 2022
e89c924
Merge branch 'vercel:canary' into mb-rewrite-renders
MaedahBatool Feb 7, 2022
bd7d1d5
Update docs/advanced-features/automatic-static-optimization.md
MaedahBatool Feb 9, 2022
b6a27ff
Merge branch 'canary' into mb-rewrite-renders
MaedahBatool Feb 9, 2022
c7e5064
link to isReady
ijjk Feb 10, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
8 changes: 8 additions & 0 deletions docs/advanced-features/automatic-static-optimization.md
View file
Open in desktop
Expand Up @@ -20,6 +20,14 @@ If the above is not the case, Next.js will **statically optimize** your page aut

During prerendering, the router's `query` object will be empty since we do not have `query` information to provide during this phase. After hydration, Next.js will trigger an update to your application to provide the route parameters in the `query` object.

The cases where the query will be updated after hydration triggering another render are:

- The page is a [dynamic-route](/docs/routing/dynamic-routes.md).
- The page has query values in the URL.
- [Rewrites](/docs/api-reference/next.config.js/rewrites.md) are configured in your `next.config.js` since these can have parameters that may need to be parsed and provided in the `query`.

To be able to distinguish if the query is fully updated and ready for use, you can leverage the `isReady` field on [`next/router`](/docs/api-reference/next/router.md#router-object).

> **Note:** Parameters added with [dynamic routes](/docs/routing/dynamic-routes.md) to a page that's using [`getStaticProps`](/docs/basic-features/data-fetching/get-static-props.md) will always be available inside the `query` object.

`next build` will emit `.html` files for statically optimized pages. For example, the result for the page `pages/about.js` would be:
Expand Down
2 changes: 1 addition & 1 deletion docs/api-reference/next/router.md
View file
Open in desktop
Expand Up @@ -50,7 +50,7 @@ The following is the definition of the `router` object returned by both [`useRou
- `locales`: `String[]` - All supported locales (if enabled).
- `defaultLocale`: `String` - The current default locale (if enabled).
- `domainLocales`: `Array<{domain, defaultLocale, locales}>` - Any configured domain locales.
- `isReady`: `boolean` - Whether the router fields are updated client-side and ready for use. Should only be used inside of `useEffect` methods and not for conditionally rendering on the server.
- `isReady`: `boolean` - Whether the router fields are updated client-side and ready for use. Should only be used inside of `useEffect` methods and not for conditionally rendering on the server. See related docs for use case with [automatically statically optimized pages](/docs/advanced-features/automatic-static-optimization.md)
- `isPreview`: `boolean` - Whether the application is currently in [preview mode](/docs/advanced-features/preview-mode.md).

The following methods are included inside `router`:
Expand Down