mirror of
https://github.com/tenrok/vue-meta.git
synced 2026-06-20 09:20:33 +03:00
chore: spell & consistency check
This commit is contained in:
+2
-2
@@ -1,6 +1,6 @@
|
||||
# How is `metaInfo` resolved?
|
||||
|
||||
You can define a `metaInfo` property on any component in the tree. Child components that have `metaInfo` will recursively merge their `metaInfo` into the parent context, overwriting any duplicate properties. To better illustrate, consider this component heirarchy:
|
||||
You can define a `metaInfo` property on any component in the tree. Child components that have `metaInfo` will recursively merge their `metaInfo` into the parent context, overwriting any duplicate properties. To better illustrate, consider this component hierarchy:
|
||||
|
||||
```html
|
||||
<parent>
|
||||
@@ -73,4 +73,4 @@ This is not what we want, since the meta `description` needs to be unique for ev
|
||||
<meta vmid="description" name="description" content="bar">
|
||||
```
|
||||
|
||||
While solutions like `react-helmet` manage the occurrence order and merge behaviour for you automatically, it involves a lot more code and is therefore prone to failure in some edge-cases, whereas this method is _almost_ bulletproof because of its versatility; _at the expense of one tradeoff:_ these `vmid` properties will be rendered out in the final markup (`vue-meta` uses these client-side to prevent duplicating or overriding markup). If you are serving your content GZIP'ped, then the slight increase in HTTP payload size is negligible.
|
||||
While solutions like `react-helmet` manage the occurrence order and merge behaviour for you automatically, it involves a lot more code and is therefore prone to failure in some edge-cases, whereas this method is _almost_ bulletproof because of its versatility; _at the expense of one tradeoff:_ these `vmid` properties will be rendered out in the final markup (`vue-meta` uses these client-side to prevent duplicating or overriding markup). If you are serving your content gzipped, then the slight increase in HTTP payload size is negligible.
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
# Any performance considarations?
|
||||
# Any performance considerations?
|
||||
|
||||
Short answer, no
|
||||
|
||||
On the client, `vue-meta` batches DOM updates using [`requestAnimationFrame`](https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame). It needs to do this because it registers a Vue mixin that subscribes to the [`beforeMount`](https://vuejs.org/api/#beforeMount) lifecycle hook on all components in order to be notified that renders have occurred and data is ready. If `vue-meta` did not batch updates, the DOM meta info would be re-calculated and re-updated for every component on the page in quick-succession.
|
||||
On the client, `vue-meta` batches DOM updates using [`requestAnimationFrame`](https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame). It needs to do this because it registers a Vue mixin that subscribes to the [`beforeMount`](https://vuejs.org/api/#beforeMount) lifecycle hook on all components in order to be notified that renders have occurred and data is ready. If `vue-meta` did not batch updates, the DOM metadata would be re-calculated and re-updated for every component on the page in quick-succession.
|
||||
|
||||
Thanks to batch updating, the update will only occurr once - even if the correct meta info has already been compiled by the server. If you don't want this behaviour, see below.
|
||||
|
||||
@@ -11,6 +11,6 @@ Previous versions of vue-meta injected lifecycle hooks from the global mixin on
|
||||
|
||||
Since v2.0 runtime performance should be improved due to:
|
||||
- the global mixin injects just a `beforeCreate` lifecycle hook, other hooks are only added for components which define `metaInfo`
|
||||
- we track component branches with `vue-meta` components which means that when refreshing metadata we can skip branches without metaInfo
|
||||
- we track component branches with `vue-meta` components which means that when refreshing metadata we can skip branches without `metaInfo`
|
||||
|
||||
:::
|
||||
|
||||
Reference in New Issue
Block a user