react 计算优化
memoization
import memoize from 'memoize-one';
getFullName = memoize((firstName, lastName) => ${firstName} ${lastName}
);
get fullName() {
return this.getFullName(this.state.firstName, this.state.lastName);
}
========================
React Hooks
import React, { useState, useMemo } from 'react';
function Example(props) {
[const] [firstName, setFirstName] = useState('');
[const] [lastName, setLastName] = useState('');
[const] renderFullName = useMemo(() => ${firstName} ${lastName}
, [ firstName, lastName, ]);
return <[div]>{renderFullName}</[div] }
======================
$ npm install use-async-memo --save
import {useAsyncMemo} from 'use-async-memo'
const replyMessage = useAsyncMemo(async () => (
// 这里的回调函数变成了async函数
await api.fetchReply(message) // 这里也变成了await
), [message])