Skip to content

Commit

Permalink
chore(docs): remove recommendation about using priority over `loadi…
Browse files Browse the repository at this point in the history
…ng=eager` with `next/image` (#71562)

This recommendation to use `priority` instead of `loading=eager` is a
little confusing.

We don't want `priority` to be overused because it can hurt performance
so we can remove this recommendation from the documentation.

TLDR:

- use `priority` for LCP like a hero image above the fold
- use `loading=eager` for other images above the folder
- use `loading=lazy` (default) for everything below the fold
- use `fetchPriority=high` if you want to load an image out of order
that its found in the document
  • Loading branch information
styfle authored Oct 21, 2024
1 parent c0722a5 commit e406def
Show file tree
Hide file tree
Showing 2 changed files with 0 additions and 8 deletions.
2 changes: 0 additions & 2 deletions docs/02-app/02-api-reference/01-components/image.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -373,8 +373,6 @@ A callback function that is invoked if the image fails to load.

### `loading`

> **Recommendation**: This property is only meant for advanced use cases. Switching an image to load with `eager` will normally **hurt performance**. We recommend using the [`priority`](#priority) property instead, which will eagerly preload the image.
```js
loading = 'lazy' // {lazy} | {eager}
```
Expand Down
6 changes: 0 additions & 6 deletions docs/03-pages/02-api-reference/01-components/image-legacy.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -221,12 +221,6 @@ The `onLoadingComplete` function accepts one parameter, an object with the follo

### loading

> **Attention**: This property is only meant for advanced usage. Switching an
> image to load with `eager` will normally **hurt performance**.
>
> We recommend using the [`priority`](#priority) property instead, which
> properly loads the image eagerly for nearly all use cases.
The loading behavior of the image. Defaults to `lazy`.

When `lazy`, defer loading the image until it reaches a calculated distance from
Expand Down

0 comments on commit e406def

Please sign in to comment.