小编Fab*_*ano的帖子

直接调用功能组件

无状态功能组件只是一个接收props和返回React元素的函数:

const Foo = props => <Bar />;
Run Code Online (Sandbox Code Playgroud)

这种方式<Foo {...props} />(即React.createElement(Foo, props))在父组件中可以省略,有利于Foo直接调用Foo(props),因此React.createElement可以消除微小的开销,但这不是必需的.

props参数直接调用函数组件被认为是一种不好的做法,为什么?这样做有什么可能的影响?这会以负面的方式影响性能吗?

我的具体情况是,有一些组件是DOM元素的浅包装,因为这被第三方认为是个好主意:

function ThirdPartyThemedInput({style, ...props}) {
  return <input style={{color: 'red', ...style}} {...props} />;
}
Run Code Online (Sandbox Code Playgroud)

这是一个演示此案例的演示.

这是一种被广泛接受的做法,但它的问题在于无法ref从无状态函数中获取包装的DOM元素,因此该组件使用React.forwardRef:

function withRef(SFC) {
  return React.forwardRef((props, ref) => SFC({ref, ...props}));
  // this won't work
  // React.forwardRef((props, ref) => <SFC ref={ref} {...props } />);
}

const ThemedInput = withRef(ThirdPartyThemedInput);
Run Code Online (Sandbox Code Playgroud)

这样它可以用作:

<ThemedInput ref={inputRef} …
Run Code Online (Sandbox Code Playgroud)

javascript reactjs

8
推荐指数
1
解决办法
486
查看次数

服务器已发送事件或Websockets的Aws负载均衡器

我正在尝试对nodejs服务器发送的事件后端进行负载均衡,我需要知道是否有办法将新连接分发给连接最少的客户端的实例.我遇到的问题是在扩展时,路由继续向已经饱和的实例发送新连接,并且因为连接很长时间,所以这根本不起作用.

对于水平扩展长期连接,我有哪些选项?

amazon-web-services websocket node.js server-sent-events aws-load-balancer

8
推荐指数
1
解决办法
642
查看次数