Browse Source

inputs array > dependencies array (#1957)

* inputs array > dependencies array

I think initially this was referred to as the "inputs array" in the docs, then it was changed to the "dependencies array" everywhere except it looks like a few were missed.

* inputs array > dependencies array

I think initially this was referred to as the "inputs array" in the docs, then it was changed to the "dependencies array" everywhere except it looks like a few were missed.
main
Kent C. Dodds 6 years ago
committed by Alex Krolick
parent
commit
b91049c057
  1. 2
      content/docs/hooks-effect.md
  2. 4
      content/docs/hooks-faq.md

2
content/docs/hooks-effect.md

@ -473,7 +473,7 @@ In the future, the second argument might get added automatically by a build-time
>
>If you use this optimization, make sure the array includes **all values from the component scope (such as props and state) that change over time and that are used by the effect**. Otherwise, your code will reference stale values from previous renders. Learn more about [how to deal with functions](/docs/hooks-faq.html#is-it-safe-to-omit-functions-from-the-list-of-dependencies) and [what to do when the array changes too often](/docs/hooks-faq.html#what-can-i-do-if-my-effect-dependencies-change-too-often).
>
>If you want to run an effect and clean it up only once (on mount and unmount), you can pass an empty array (`[]`) as a second argument. This tells React that your effect doesn't depend on *any* values from props or state, so it never needs to re-run. This isn't handled as a special case -- it follows directly from how the inputs array always works.
>If you want to run an effect and clean it up only once (on mount and unmount), you can pass an empty array (`[]`) as a second argument. This tells React that your effect doesn't depend on *any* values from props or state, so it never needs to re-run. This isn't handled as a special case -- it follows directly from how the dependencies array always works.
>
>If you pass an empty array (`[]`), the props and state inside the effect will always have their initial values. While passing `[]` as the second argument is closer to the familiar `componentDidMount` and `componentWillUnmount` mental model, there are usually [better](/docs/hooks-faq.html#is-it-safe-to-omit-functions-from-the-list-of-dependencies) [solutions](/docs/hooks-faq.html#what-can-i-do-if-my-effect-dependencies-change-too-often) to avoid re-running effects too often. Also, don't forget that React defers running `useEffect` until after the browser has painted, so doing extra work is less of a problem.
>

4
content/docs/hooks-faq.md

@ -740,7 +740,7 @@ The [`useMemo`](/docs/hooks-reference.html#usememo) Hook lets you cache calculat
const memoizedValue = useMemo(() => computeExpensiveValue(a, b), [a, b]);
```
This code calls `computeExpensiveValue(a, b)`. But if the inputs `[a, b]` haven't changed since the last value, `useMemo` skips calling it a second time and simply reuses the last value it returned.
This code calls `computeExpensiveValue(a, b)`. But if the dependencies `[a, b]` haven't changed since the last value, `useMemo` skips calling it a second time and simply reuses the last value it returned.
Remember that the function passed to `useMemo` runs during rendering. Don't do anything there that you wouldn't normally do while rendering. For example, side effects belong in `useEffect`, not `useMemo`.
@ -767,7 +767,7 @@ Note that this approach won't work in a loop because Hook calls [can't](/docs/ho
### How to create expensive objects lazily? {#how-to-create-expensive-objects-lazily}
`useMemo` lets you [memoize an expensive calculation](#how-to-memoize-calculations) if the inputs are the same. However, it only serves as a hint, and doesn't *guarantee* the computation won't re-run. But sometimes you need to be sure an object is only created once.
`useMemo` lets you [memoize an expensive calculation](#how-to-memoize-calculations) if the dependencies are the same. However, it only serves as a hint, and doesn't *guarantee* the computation won't re-run. But sometimes you need to be sure an object is only created once.
**The first common use case is when creating the initial state is expensive:**

Loading…
Cancel
Save