Question

说我有这样的（有些人为成分）

    const ExampleComponent = (props) => {
    const renderList = () => {
        if (props.list) {
            props.list.map((item) => <ListItem {...props.list} />);
        } else {
            return <div>List Not Found </div>
        }
    };

    return (
        <div>
            <H1>LIST VIEW</H1>
            {renderList()}
        </div>
    )
};

React是否会在每个渲染刻度上重新初始化该函数？我应该担心这个问题还是忽略不计的细节？

是否考虑将我的组件写为

const renderList = (list) => {
    if (list) {
        list.map((item) => <ListItem {...list} />);
    } else {
        return <div>List Not Found </div>
    }
};

const ExampleComponent = (props) => {
    return (
        <div>
            <H1>LIST VIEW</H1>
            {renderList(props.list)}
        </div>
    )
};

Answer 1

只需阅读以下内容：http://wiki.c2.com/?PrematureOptimization

“程序员浪费大量时间来思考或担心程序非关键部分的速度，而这些效率的尝试实际上在考虑调试和维护时会产生严重的负面影响。我们应该忘记效率低下，大约有97％的时间表示：过早的优化是万恶之源，但我们不应该在这3％的临界水平上放弃自己的机会。”

回答您的问题：

React是否要在每个渲染刻度上重新初始化该功能？是的，该功能将在每个渲染上重新声明。

我应该为此担心还是忽略不计？。

在无状态组件内部定义方法的利弊

1 个答案: