Use inline elements directly instead of createElement

[natefaubion]

https://babeljs.io/docs/plugins/transform-react-inline-elements/

This would let us get around issues with createElement's API (which mixes in key and ref with the normal props), and avoid the headaches with the attempt in master at typing createElement.

[natefaubion]

This would also let us remove the dynamic variants of elements.

[ethul]

Sounds good to me!

[natefaubion]

I tried this out and it seemed to work alright, but if I mixed this with normal createElement I got a single warning about key props in array/iterators, which was strange. React seems to duplicate this check. Once in the createElement API, but then again as part of the reconciler, which I don't understand.

[natefaubion]

Unfortunately, I don't think this is tractable. React does all sorts of crazy stuff in dev mode to secretly track validation, which means you'll get all sorts of strange warnings since the correct secret flags aren't in the correct secret place.

[ethul]

Thanks for giving this a go. Based on your findings, it sounds like it is probably best to leave this out for now.

[natefaubion]

I think you could maybe createElement at startup and poke it to see if it has dev-mode validation flags, and conditionally add them. But I think I'd rather experiment with that at scale to see what kind of drawbacks it has. It's fine for production mode, but I'm not sure if it would make development confusing.

[natefaubion]

Here is my branch with the appropriate switch if anyone wants to mess with it. https://github.com/natefaubion/purescript-react/tree/inline-elements

[ethul]

Thanks!