DEV Community

Adam Crockett
Adam Crockett

Posted on • Updated on

Why I haven't committed to React (yet)

JSX is the one contribution to my overall development experience over the last few years, I have used JSX / TSX in Vue.js and really preferred it over SFCs for a good long while.
Then I picked up lit-html and saw another more natural way to write templates, but then google kind of merged the project with lit-element. It's okay... But lit-element added a ton of boilerplate on top of the simple templating language I was attracted to, mostly declaratively defined OOP which I will tolerate but not enjoy.

Finally I finished my trip to obscurity with another JSX powered beast, Stencil - a way of writing web components that is so good, for two years, I couldn't bring myself to learn React, and not stand out. Stencil like Svelte is a compiler and scores incredibly well in performance out of the box, 100 performances, yes please! It also manages to do SSR with web components, yeah, no idea how 🧙‍♂️, today I'm not going to learn about that.

React is kind of the jQuery of today (in it's popularity and future tech debt hangover), so everyone must know it, which sucks for me because I could pick up React projects which I often do, but am I a React expert? Kinda, sorts, no.. so no CV entry 😅

But React functional components, they look nice, and all the libraries I personally will never finish in order to get to my end goal, well they already exist In React... So today with great caution, I am going to try and get React on my CV, like everyone else, I'm so mainstream.

useEffect go!

Discussion (7)

Collapse
itays123 profile image
Itay Schechner

Good luck! The key of modern React is using custom hooks for the component logic, and leaving the functional components for UI (jn my opinion)

Collapse
adam_cyclones profile image
Adam Crockett Author

I will have to strip away the React terminology as I'm a newbie, kind of, do you mean the secret of good software engineering in the UI is to keep UI and business logic separate and testable? I couldn't agree more! actually I believe that business logic should be standalone agnostic and portable using something like XState as a framework for modeling business logic, in theory you could model the entire app and test it without a UI. Anyway if I'm going to get good at React I will have to learn the terminology

Collapse
matjones profile image
Mat Jones

Fun fact, lit is literally just polymer renamed lmao

github.com/lit/lit/commit/d1fc7828...

Collapse
adam_cyclones profile image
Adam Crockett Author

You are correct, but this wasn't always the case, kind of, it isn't the lit I talked about anyway.

lit-html was in the past, the templating engine for lit-element, the latter being a offshoot of polymer... sigh they must have gone fully polymer, talk about flogging a dead horse 🐎.. anyway the lit-element part is still available, but by this point I had looked into other very similar ahem original engines, I can't remember the names of those but lit must have been pretty damn inspired by them 😳☺️😂

LIT joins Angular for most confusing project management decisions.

There are better ways to make web components here are 3.

  • Stencil
  • Svelte
  • Hybrids.js
Collapse
matjones profile image
Mat Jones

I’ve looked at Stencil but haven’t used it. Svelte I’ve done a basic sort of “hello world” Progressive Web App demo, it’s quite nice.

Collapse
jfbrennan profile image
Jordan Brennan

wait you like JSX more than SFC?!!? are you okay, do you need help?

Collapse
adam_cyclones profile image
Adam Crockett Author • Edited

Single Filed Chicken is okay but Jombo Sized Xmas is better yep.

Kidding, I like sperate files for context switching and reasoning. I also like that JSX unlike SFC is not tied to the framework it is synonymous with. You can't just simply use .vue files in a. Angular project (for some reason) but you can take knowledge with you around JSX and use it in lots of different places, making entirely new frameworks etc, therefore JSX is a greater contribution to the future of JavaScript.