JSX vs. Pure JavaScript

In notebook:
FrontEndMasters React
Created at:
libraries React JavaScript
Opens the 1-your-first-component directory.
Creates app.js:
  //  **** app.js         ****
var React = require('react');

// ES6 destructuring assignment
var { h1, div, li, ul } = React.DOM;
// equivalent to
var h1 = React.DOM.h1;

var element = div({},
            h1({}, "Hello"),
                li({}, "Marc with C"),
                li({}, "Mark with K")
var React.render(element, document.body);
These are just functions. It's not creating string of HTML, but objects that represent the HTML. It creates raw DOM.
He can call ​div​ and add as many arguments as he wants and these will become child elements.

The equivalent in JSX would be:
  var element2 = (
        <h1>Hellow from JSX </h1>
            <li>Marc with K</li>
            <li>Mark with C</li>
There's not definitive preference in the community in JSX over plain functions. Functional programming people prefer just functions.Under the hood, React converts these to ​React.createElement("div", null,..)​ (demos in debugger)

JSX is more readable. But these are just functions. The performance is the same.