Validate node nesting structure

[sophiebits]

This solution feels a little gross to me, but I haven't been able to come up with anything better.

Fixes #101.

[sophiebits]

I ran react-bench and there was no significant perf difference relative to master.

[jordwalke]

It's been a while since I've had context to this particular problem. Here's a couple of thoughts:

1. We try to strive to make dev and production be functionally equivalent - modulo any difference in the amount of information logged. So it's good that you chose to log a warning instead of an error.
2. With this diff, we allocate twice as many objects upon the initial render (and then use pooled instances going forward) (compared to the number of strings we allocate/return from the mounting process). But we only perform the validation on these new objects in DEV. Couldn't we simply use a regex to test the leading few characters of every markup fragment we insert? This would help us avoid having to pay the cost of all the allocations (or getting pooled instances) in production at all. And even if we feel the regex based check is hacky, it's just something that runs in DEV anyways, so we don't have to feel bad about it.

[sophiebits]

Yeah, that makes sense and is simpler for sure. I considered it before I implemented it. This seemed cleaner before I implemented it; but it turns out that this way is a lot of code! I was sort of hoping that the MountImage class could store more info in the future so you could check descendant nesting (for nested <a> tags) and things like that but it's overkill for now.

[jordwalke]

@spicyj - I hear you on the "cleaner" part. In fact, I like this much better. But for the web, at least, we'll probably always want the "image" to be either a chunk of markup, or a single DOM node (when node creation becomes faster in all browsers).

[vjeux]

What's the status here? Do we want to pursue this diff?

[sophiebits]

I'll close it for now.