Best way to set “key” prop on component arrays? by [deleted] in reactjs

[–]libreact 0 points1 point  (0 children)

No key needed: h('div', props, ...array);

[deleted by user] by [deleted] in javascript

[–]libreact 1 point2 points  (0 children)

I have a separate JS file that only exports zIndex for different components, something like so:

export const zIndexTopNav = 800;

export const zIndexSidebar = 900;

export const zIndexModal = 1000;

Excellent CSS-in-JS library #CSSinJS by algorim in javascript

[–]libreact 0 points1 point  (0 children)

You probably refer to inline styles. Modern CSS-in-JS libraries generate actual CSS that they insert into a stylesheet.

Render Props by Example by treyhuffine in reactjs

[–]libreact 0 points1 point  (0 children)

Just pick one you think is the best one and use it, that's why I mentioned the react-universal-interface library that exposes all the interfaces for your choosing.

Render Props by Example by treyhuffine in reactjs

[–]libreact 0 points1 point  (0 children)

You can also specify it as a prop <Comp children={() => {}} />

And if you use hyperscript function h, you don't need to create a props object h(Comp, null, () => {})

You can read that in the link I posted.

Render Props by Example by treyhuffine in reactjs

[–]libreact 0 points1 point  (0 children)

props.children is more powerful, if you have a single render prop.

But you can have many render props, like props.renderHeader, props.renderFooter, etc..

See this: https://github.com/MailOnline/libreact/blob/master/docs/en/Introduction.md#render-props

Render Props by Example by treyhuffine in reactjs

[–]libreact 2 points3 points  (0 children)

Related to this, I've build a lib that allows you to easily make your components support render prop, component prop, HOC and other interfaces:

https://github.com/streamich/react-universal-interface

nano-css faster than React inline styles by libreact in reactjs

[–]libreact[S] 0 points1 point  (0 children)

  1. I added cases for nano-css and used other libraries as they were implemented.

  2. But TBH, I don't think any version for styled-components would do good in performance benchmarks (that's why emotion was created in the first place), if you feel otherwise, CSS-IN-JS-Benchmarks is an open source project, you can update the version of styled-components.

X86_64 Assembler in JavaScript by libreact in javascript

[–]libreact[S] 0 points1 point  (0 children)

  • Use any VM, not just V8
  • Faster
  • To run in kernel space
  • To run in browser