Zengtudor/Nuxt
1
0
Fork 0
mirror of https://github.com/nuxt/nuxt.git synced 2025-02-07 09:22:27 +00:00
Code Issues Packages Projects Releases Wiki Activity

docs: fix case

Browse Source
This commit is contained in:
Michael Brevard 2024-06-10 11:56:41 +03:00 committed by GitHub
parent 0792f95b86
commit 6be28279f1
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 3 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
docs/2.guide/2.directory-structure/1.components.md
View File

@ -121,11 +121,11 @@ const show = ref(false)
## Delayed Hydration
In real world applications, some pages may include a lot of content and a lot of components, and most of the time not all of them need to be interactive right off the bat. Having them all load eagerly can negatively impact performance and bundle size.
In real world applications, some pages may include a lot of content and a lot of components, and most of the time not all of them need to be interactive as soon as the page is loaded. Having them all load eagerly can negatively impact performance and increase bundle size.
In order to optimize the page, you may want to delay the hydration of some components until they're visible, or until the browser is done with more important tasks for example. Nuxt has first class support for delayed hydration components and can help you reduce your boilerplate along the way.
Nuxt has reserved component prefixes that will handle this delayed hydration for you, that extend dynamic Imports. By prefixing your component with `LazyVisible`, Nuxt will automatically handle your component and delay its hydration until it will be on screen.
Nuxt has reserved component prefixes that will handle this delayed hydration for you, that extend dynamic imports. By prefixing your component with `LazyVisible`, Nuxt will automatically handle your component and delay its hydration until it will be on screen.
```vue [pages/index.vue]
<template>
@ -146,7 +146,7 @@ If you need the component to load as soon as possible, but not block the critica
```
::important
Since Nuxt uses `LazyIdle` and `LazyVisible` to handle delayed hydration, you should avoid naming your components that, as dynamic imports will break for you. Delayed Hydration would still be possible by adding the prefix, for example to a component named `IdleBar`:
Since Nuxt uses `LazyIdle` and `LazyVisible` to handle delayed hydration, you should avoid naming your components that, as dynamic imports will break for you. Delayed hydration would still be possible by adding the prefix, for example to a component named `IdleBar`:
`<LazyIdleIdleBar />`
::