Great document overall! Here's a couple of comments:
Closing tags make it easier to read a long list of end delimiters.
I think this only matters when reading code with the intention to edit it, not when simply reading it. When reading code without any intention to edit it, you generally assume that all braces are properly closed, and so you skip them. However, it is true that when editing code, a closing tag can help find the block of code you want to move or delete, provided it is unique enough (</div></div></div> doesn't help much). There are editing disadvantages too, however. For example, I want to change Theme to AnimatedTheme, I have to edit in two places.
Syntax is familiar to people who know HTML or XML.
I'd like to disagree on this point. I think familiarity plays a minor role here. Web developers are quite familiar with JS syntax too, as well as CSS. I think the biggest reason JSX syntax works on the Web is because it maps directly to HTML. Consider this JSX snippet <h1>{greet(user)}</h1>. You run the app, open Chrome Dev tools and you see exactly that: <h1>Hi, Bob!</h1>. That's also the language your server-rendered pages speak. You'd have to do mental translation if you changed that to h1(greet(user));.
Great document overall! Here's a couple of comments:
I think this only matters when reading code with the intention to edit it, not when simply reading it. When reading code without any intention to edit it, you generally assume that all braces are properly closed, and so you skip them. However, it is true that when editing code, a closing tag can help find the block of code you want to move or delete, provided it is unique enough (
</div></div></div>
doesn't help much). There are editing disadvantages too, however. For example, I want to changeTheme
toAnimatedTheme
, I have to edit in two places.I'd like to disagree on this point. I think familiarity plays a minor role here. Web developers are quite familiar with JS syntax too, as well as CSS. I think the biggest reason JSX syntax works on the Web is because it maps directly to HTML. Consider this JSX snippet
<h1>{greet(user)}</h1>
. You run the app, open Chrome Dev tools and you see exactly that:<h1>Hi, Bob!</h1>
. That's also the language your server-rendered pages speak. You'd have to do mental translation if you changed that toh1(greet(user));
.