时间戳

首页 > 解决方案 > 使用小组件的 React-Native 性能

reactjs - 使用小组件的 React-Native 性能

问题描述

快速提问，

为了组织我的项目，我LinearGradient定义了一些与此类似的组件：

export class YellowGradient extends React.Component{
    render() {
        return <LinearGradient id="yellow-gradient" x1="200" y1="0" x2="200" y2="400">
            <Stop offset="0" stopColor="#f4eb42" />
            <Stop offset="1" stopColor="#e0db7d" />
        </LinearGradient>
    }
}

这使我能够在 SVG 组件上在整个系统中重用相似的颜色（即，<YellowGradient>当我想要这个黄色渐变时，我只需要在 SVG 组件的定义中添加一个），但是我担心像这样的嵌套组件也可能会添加应用程序的大量开销。

我担心是对的，还是像这样的小型常量组件会被优化掉？为了重用像这样的小组件，是否有更好的模式可以遵循？

提前致谢

标签： reactjsreact-native

解决方案

唯一知道的方法是测试它。但是，如果您确实遇到任何优化问题，我建议您使用React.PureComponent. 这将提高您的应用程序速度并停止那些减慢应用程序的重新渲染。

推荐阅读