Discussion: ES5 vs ESNext vs JSX

[ryanwelcher]

There is an ongoing discussion in the Gutenberg project around how to handle the delineation around ES5, ESNext, and JSX since dropping IE 11 support.

With the dropping of support for IE11, the targeted browsers all support the ES6 syntax. So the distinction is no longer accurate, as it is not between ES5 and a newer syntax; but between not building JavaScript and using JSX that requires a build.

Now that all targeted browsers support ES6, is there a need to maintain examples that use features/syntax required for IE11?

Currently, the ES5 and ESNext examples are using different ESLint standards and this could be simplified by targeting plugin:@wordpress/eslint-plugin/recommended" for all examples.

The major difference between the ES5 and ESNext versions after updating the examples is that ESNext uses JSX while ES5 does not. For reference Example: Basic and Example: Basic (ESNext)

It seems almost redundant to have both versions of that block. Perhaps we condense the example to a single block that uses JSX to match what would be found in the Gutenberg project and we add a README to show how the same thing could be done using non-JSX

[sparklingrobots]

Given that this repo is intended to demonstrate best practices and that most of our community is not yet deep into JavaScript, I'm in favor of simplifying the path we present instead of offering a choice of ESNext vs. JSX. If we can have a README or other supplementary doc that explains how to use ESNext for those folks who don't want to use JSX for whatever reason, I think that would be sufficient.

[juanmaguitar]

Hi, from my experience teaching Javascript I think the best way to understand the examples is to offer just one version of the code in the examples.

If we can have a README or other supplementary doc that explains how to use ESNext for those folks who don't want to use JSX for whatever reason, I think that would be sufficient.

I agree with @sparklingrobots on this. As long as we offer the right explanations around the code examples displayed in the examples and maybe suggesting some tools to use them, I think that's OK

IMHO one of the things a good documentation (and examples) should do is offer guidance to simplify the learning experience of the users and we would do just that by displaying the most used version of the code in the modern Javascript ecosystem.