DEV Community

Discussion on: Commonly Used UI Components In React

Collapse
deathshadow60 profile image
Comment marked as low quality/non-constructive by the community. View Code of Conduct
deathshadow60

Sadly this is all just a stunning example of why I consider react and its kin/kine utter and complete garbage. JavaScript client-side doing things that are none of JavaScript's business any time after around a decade ago, zero graceful degradation client side given the train-wreck of scripting being the only functionality, writing two to five times the code needed to have it vomit up two to ten times the code needed because "wah wah, JavaScript is the answer to everything"...

Much like every other framework, it's a monument to 3i. Ignorance, incompetence, and ineptitude... to the point I am thoroughly convinced its CREATORS aren't qualified to write a single like of HTML or CSS.

Just take the first example of a dropdown... You have to stand in AWE of the incompetence required to vomit up 52k of markup and 15 MEGABYTES of "JavaScript for Nothing" being loaded for a dropdown that any COMPETENT developer would only have spent 1.2k of markup and 2.5k of CSS on! It only makes you work harder, not smarter...

This is even more of a problem since again, it doesn't gracefully degrade scripting off/blocked, doesn't work on screen readers, so if you deploy this on a website you're looking at possible legal ramifications. See how now even Dominos is under fire for Americans with Disabilities Act violations. GARBAGE like using React in this manner is EXACTLY the type of coding practice guaranteed to get you pimp slapped under the US ADA, or equivalent laws abroad like the UK's EQA. Made all the more terrifying by the fact it's no longer just banks, government agencies, health care, and so forth being held to WCAG or even stricter standards. With the supreme court refusing to hear Dominos case making the lower court ruling stand, we now have precedent for any business to be held accountable for these types of failings.

Good client side scripting should enhance an already fully working page, and never be the only means of providing functionality. In that way ALL of these react examples are utter and complete failures at web development.

10 to 100 times the code needed whilst flipping the bird at usability and accessibility? Yeah, how is this a good choice in technologies apart from covering up for not knowing enough HTML or CSS to even be working on the front-end in the first place?

I don't get it.

Collapse
flixbox profile image
Felix

Good React code is smaller than HTML, not bigger. React strives for reusable components. Pure HTML is not reusable. You write it once and that's it.

Collapse
deathshadow60 profile image
Comment marked as low quality/non-constructive by the community. View Code of Conduct
deathshadow60

That's because it barely outputs any HTML at all in the majority of use cases. hence why ALL the code fiddles if you ran the bloody page with scripting disabled, has ZERO page content whatsoever.

Instead it's using JavaScript to vomit up JavaScript to kind-of TRY and put together broken inaccessible incomplete markup client side, instead of creating useful well written markup SERVER-SIDE.

Hence why for example this gem of "I cans haz teh intarwebs"

codesandbox.io/s/white-river-tl7fs

Is wasting on the output side 37k of markup on what should be a FORM, H1, five LABEL, five INPUT, a BUTTON, and MAYBE an extra DIV. That's not even 2k of HTML's flipping job!

That they then have the markup applied by vomiting it together innerHTML style instead of ACTUALLY using the DOM, have a DIV where there should be a FIELDSET, are wasting a INPUT to do BUTTON's job like it's still 1997, have ZERO semantic relationship between the LABEL and the INPUT because they omitted the ID's on the INPUT, etc, etc... Basically it takes 400 extra bytes to make 100% certain it deploys client-side 15 times the markup needed.

Nothing like 36k of accessibility violations with zero graceful degradation doing 2k of HTML's job. And for what? So you can slop it together with 2.4k of scripting instead of just manning up and using HTML properly?

Colour me unimpressed... and it's nonsense like this I've spent the past decade cleaning up after court case after court case, client after client... because the moment you pull derpy coding stunts like this, is the moment you risk ending up like Dominos. Or that Portuguese bank... or the dozens of smaller banks, public utility companies, health clinics, and so forth that make up the bulk of my clientele.

I don't care how 'resusable" it is when it's spitting out 15 times the code needed client side, making you write more code server-side than you need, that relies on even more library code, that results in websites that don't gracefully degrade telling large swaths of potential users to go suck an egg.

Maybe if people stopped using five to twenty times the code needed to do the job BEFORE we even include the size of these derpy frameworks into the equation, they would see how mind-numbingly STUPID these systems are.

But again, the people who MAKE these systems with every example make it plainly obvious they don't know enough about HTML or CSS to be working on the front-end, much less making systems that sucker in all the rubes and nubes. "For people who know nothing about websites, BY people who know nothing about websites" is not a recipe for success.