3 ms·

Show HN: Web-based Babel alternative for React/JSX (ultra-fast and tiny 5.1 kB)

5 points by __app_dev__ 7y ago

__app_dev__ 7y ago
Here is a Hello World Demo: https://www.dataformsjs.com/examples/hello-world/en/react.htm https://www.dataformsjs.com/examples/hello-world/en/react.ht... If you view with any modern browser it will use `jsxLoader.js` as the compiler and if you use IE 11 or other old browsers it will download and use Polyfills with Babel Standalone.
FreeHugs 7y ago
The jsxLoader.js script was created to provide a fast method for including React with JSX on web pages and web apps with no build process React does not have a standalone script that does that? I was under the impression that these scripts do exactly that: https://reactjs.org/docs/cdn-links.html https://reactjs.org/docs/cdn-links.html What am I missing?
- __app_dev__ 7y ago
  Great Question. Looks like I need to make the document clearer on why. All Demos and Templates use the React CDN links you listed. The reason this file exists is so that JSX Code can be used in a browser without Babel. Babel Standalone can be used on pages but it is huge and takes a lot of memory and a few extra seconds to display the page. The [jsxLoader.js] file allows JSX to be used almost instantly.
  - FreeHugs 7y ago
    I still don't get it. Why is Babel needed to use JSX?
    - __app_dev__ 7y ago
      Do you build React Apps? If so what are you using other than Babel?
      - FreeHugs 7y ago
        No. So React itself brings no function to transform JSX into javascript clientside?
        __app_dev__ 7y ago
        That's correct. In most cases React is used with client side tools `webpack`, `create-react-app` etc and all of these depend on Babel. There is a Babel Standalone file that works when used directly on a page but it's huge 1.5 MB of JS so and it takes many seconds to process. The `jsxLoader.js` file I created uses Babel Standalone for old browsers (IE 11) and then for modern browsers it transforms JSX to JS very quickly without the need for Babel.

5 points by __app_dev__ 7y ago

Here is a Hello World Demo: https://www.dataformsjs.com/examples/hello-world/en/react.htm https://www.dataformsjs.com/examples/hello-world/en/react.ht... If you view with any modern browser it will use `jsxLoader.js` as the compiler and if you use IE 11 or other old browsers it will download and use Polyfills with Babel Standalone.

FreeHugs 7y ago

The jsxLoader.js script was created to provide a fast method for including React with JSX on web pages and web apps with no build process React does not have a standalone script that does that? I was under the impression that these scripts do exactly that: https://reactjs.org/docs/cdn-links.html https://reactjs.org/docs/cdn-links.html What am I missing?

__app_dev__ 7y ago
Great Question. Looks like I need to make the document clearer on why. All Demos and Templates use the React CDN links you listed. The reason this file exists is so that JSX Code can be used in a browser without Babel. Babel Standalone can be used on pages but it is huge and takes a lot of memory and a few extra seconds to display the page. The [jsxLoader.js] file allows JSX to be used almost instantly.
- FreeHugs 7y ago
  I still don't get it. Why is Babel needed to use JSX?
  - __app_dev__ 7y ago
    Do you build React Apps? If so what are you using other than Babel?
    - FreeHugs 7y ago
      No. So React itself brings no function to transform JSX into javascript clientside?
      - __app_dev__ 7y ago
        That's correct. In most cases React is used with client side tools `webpack`, `create-react-app` etc and all of these depend on Babel. There is a Babel Standalone file that works when used directly on a page but it's huge 1.5 MB of JS so and it takes many seconds to process. The `jsxLoader.js` file I created uses Babel Standalone for old browsers (IE 11) and then for modern browsers it transforms JSX to JS very quickly without the need for Babel.