← Back to context

Comment by makeramen

5 years ago

> If you know HTML you JSX is very intuitive.

That's a poor assumption that appears to be based on your personal preferences and what you're comfortable with. I personally find both require some learning, but prefer the svelte version.

And JSX isn't JavaScript and it isn't HTML, and if you know JavaScript and HTML you still don't know JSX, so you're still using "yet another language" in addition to JavaScript and HTML.

  • JSX is easy to summarize as: HTML where everything in curly brackets is a JS expression that gets evaluated. There are some additions (prop spreading) and restrictions (curly brackets apply to whole attribute values and element bodies only), but they're very simple.

    • And custom event handling attributes, camel casing, special cases like htmlFor and className, non-standard attributes being ignored except for custom elements, the style attribute, the special case of checked/selected properties vs attrs for form elements, key and ref properties. Plus all the semantics of component updates, memoizing and so on.

      This is already far more to learn than the handful of simple control structures Svelte introduces.

  • Come on… If you know JavaScript and HTML you are 95% of the way to being fluent in JSX. It’s basically just JavaScript expressions.

    • And if you know javascript and html you are 100% fluent in any sort of hyperscript, which is just js expressions.

  • JSX is JS. Nested brackets are simply converted to nested function calls & objects, attributes convert to properties.

    This is evident when comparing conditionals, loops, etc. Instead of learning template syntax you simply use JS syntax, albeit a declarative subset (no branches).

    JSX is simply syntactical sugar for nested JS, you can use it without, but it's prettier with.

    One could add this syntactical sugar natively to the language spec, in fact E4x (ECMAScript for XML) share some properties w/ JSX and was once proposed to the spec.

    edit: instead of downvoting, please voice how you disagree with my assessment

    • Jsx is not js, it’s python!

        <div className={red}>
          {text}
        </div>
      
        import react
        react.create_element("div", {"className":red}, text)
      

      By the same logic we could call any structured format “is js”, because it is homomorphic to some js expressions. Are xml, pug, plist, dbf, all js? Nope, it’s all python.

    • I agree 100%... Adding JSX to the language spec would be interesting. It might be too heavy to include within the language spec as many JS applications do not involve the DOM at all, so then you have to essentially bundle DOM functions into every application... or common.js would omit this subset of the language.

      3 replies →

  • JSX is just JS with brackets instead of nested function calls. I expected more from this community than this kind of commentary.