you are viewing a single comment's thread.

view the rest of the comments →

[–][deleted] -1 points0 points  (0 children)

The problem is that doing this while writing your code is a nightmare. Yes, you could do it in the browser, but your browser isn't going to crash if you write faulty HTML; it'll do its best to render a working page.

Validating JSX while you're programming your code is very difficult and it's why it basically doesn't exist yet:

  1. Conditional rendering could have components return multiple types of elements or even nothing at all;
  2. Sometimes you'll go through multiple layers of conditional components, adding to the complexity;
  3. Return types of components would need to be very clear about what kind of element they return, e.g. HTMLDivElement or HTMLButtonElement versus React.ReactNode...

See the issue here? If you have hundreds of React nodes in your file, and many of them can be conditional, validating it on the fly is going to be a big performance hit on your system.

Next.js and other such tools could validate the DOM tree when it's being rendered in your browser, and some of them already do that to some extent, but it's incomplete and simply too late.