DEV Community

Rick Delpo
Rick Delpo

Posted on • Updated on • Originally published at javasqlweb.org

React vs Plain JS

This piece is not meant to be a rant about React but rather just some observations. I hope that writing this does not make me unpopular. I do welcome opposing opinions.

I got involved with React only one year ago because I read so much about it (jamstack, netlify, serverless etc). I am a simple developer, primarily back-end, so I don’t think I need all the frills React has to offer. Please convince me otherwise.

After about one month of struggling with React I switched to Plain Vanilla Javascript for the following reasons:

  1. React seemed too complicated but I was happy to learn it
  2. I did not want to be beholden to Node JS
  3. Babel placed a cookie at my site when i used this react library vs node on my html page
  4. I was intimidated by React because I don’t feel smart enough, it seems a bit over my head. Please explain State in plain English.
  5. I discovered array methods in plain js for rendering data in html
  6. no libraries to import with plain js
  7. plain js seems much more sophisticated these days than 5 years ago
  8. all i really want from my JS is a Fetch or axios api (the http client)
  9. I fetch AWS Lambda functions in my plain JS where I use Lodash which is similar to array methods but u do need to import both fetch and Lodash in Lambda. I still avoid Node this way.
  10. SEO is impacted when we use React. Even with SSR I did not want to do the extra step and also with SSR it seemed complicated to become serverless
  11. I did not want to do Gatsby, just simple JS (I don't fully understand why we need additional React libraries like Gatsby or Next.JS). As a beginner, after just barely grasping basic React, I was immediately faced with learning these other things that also use React. It was a turnoff because I was already overwhelmed.
  12. my needs were just simple JS, I just want a little bit of JS not a lot
  13. same goes for NODE JS, I don’t want the whole enchilada just a small part of it so I imported Babel library in my html. I was turned off by the hundreds of dependencies imported with Node
  14. I did not like React Router
  15. I don’t like the idea of a single page app in React
  16. I think JSX is cool but don’t really need or want it
  17. I now use AWS Lambda for my server side logic so I don’t really need Node JS. Prior to Lambda I deployed Java Servlets at server side. I recognized the need to be more modern day with my stack.

Wow, I didn’t think I had this many reasons for opting to use Plain JS vs React

I do like challenges but I really did not want to be married to React. My architecture involves much more than the front end and I don’t have the time to put in for the seemingly high React learning curve.

I am a Java and SQL developer so not much of a front end person anyway. Do a Google search on Rick Delpo to find out more about me or visit my website where I have supporting material for this article at https://howtolearnjava.com or at https://javasqlweb.org/AWS/

Thanks for reading and I invite comments on such a controversial topic. Please, I would be very interested in comments about why React is so great. I would definitely use React in some use cases if someone gives me a compelling reason to do so.

Self criticism - I might be too shortsighted because I am a back-end developer (always eager to learn more though)

Oldest comments (16)

Collapse
 
karladampilag profile image
Karla Dampilag

It seems the whole summary of your bullet points is that, for your needs, plain JavaScript is enough. That's fine, tbh. Using React when you don't need it for an application is overkill. When you find yourself starting to struggle doing so many manual things in the front-end with JS, that's a good time to maybe consider introducing React, to make your life easier. But if you don't feel like you ever get to that point in your use cases, then plain JS is fine and there's really nothing wrong with that. React shines when developing complex front-end applications. When not working on such applications, one won't really appreciate React. At that point, React won't be worth the extra configurations and additional learning curve. It's at the complex front-end applications when benefit is way greater than the additional set-up work.

Collapse
 
rickdelpo1 profile image
Rick Delpo

Hey thanks Karla, for the time u put into responding. I was 20 years stuck in a corporate silo doing SQL and, no joke, just started exploring the front-end in 2019. Because I am a data person I guess I am not needing that much from my JS as u point out. I only really want a Fetch API and some JS array methods to render data in JSON. So now I feel much better after ur explanation. Thanks again, u made my day !!

Collapse
 
leob profile image
leob

Haha refreshing, why does this post have only one or two likes ... ?

Collapse
 
getsetgopi profile image
GP

There is absolutely nothing wrong in getting things done without all the bells and whistles (Webpack, Node, Babel, React, compilers etc.,) and just by Vanilla JavaScript. You need React only when you want to break your page into individual component(s)(separate js file) and render them on demand, reuse component by passing new value, avoid DOM re-rendering, have control on the components, code splitting, depend on state rather than variables etc.,

React is just 40%, rest all the business logic you write is JavaScript.

Collapse
 
rickdelpo1 profile image
Rick Delpo

Hey thanks for the reassurance. I guess one of my concerns also is that rendering separate JS files vs html files would impact my SEO endeavor. Also I don't like NODE JS, importing hundreds of files for any project makes me feel lost.

Collapse
 
gmartigny profile image
Guillaume Martigny

Hi Rick,
Today, there's a lot of frontend frameworks and React maybe not what click for you. You should try others and see what they have to offer.
Personally, I don't like React that much. But I'm in love with Vue.js and Svelte offer some really interesting features.

Collapse
 
rickdelpo1 profile image
Rick Delpo

Thanks for the good advice. I will start researching Vue vs React for starters

Collapse
 
rickdelpo1 profile image
Rick Delpo

Please someone explain my point #11 in plain English as I am researching and still don't get it. Thanks.

Also, a plain English on SSR would be helpful too

Collapse
 
elvisvan profile image
Elvis Van

why did u not like react router?

Collapse
 
rickdelpo1 profile image
Rick Delpo

Hey..thanks for reading, my reason for not liking React Router is not related to React but rather to SEO. I think the concept of a single page app is great but by rendering this way we forgo the organic clicks from multiple pages that get an SEO ranking because Google search console favors rich content from external html pages that relate to specific topics. I have 3 high ranking pages but if I used React Router Google Search would have missed all three.

Collapse
 
efpage profile image
Eckehard

Are you sure about SEO? I thougth Google will read this pages too now.

Thread Thread
 
rickdelpo1 profile image
Rick Delpo

Yes, great strides have been made via server side rendering in react where on page load the html is injected directly into the html div tag. But I believe u still need to use a single page app for this with react router. My point for seo was that i had 3 chances to rank using 3 all html pages vs 1 single page app. I would rather have 3 ranking pages vs only 1. PS, I am not an expert in SEO, only using my common sense here. Thanks for engaging in the conversation.

Collapse
 
efpage profile image
Eckehard

Maybe you try out my DML "framework". It does all the job without learning React and is blazing fast. Uses vanilla JS only, no frameworks, no depenencies. Just a new way of thinking.

The homepage was created using DML too, fairly simple set up

Collapse
 
rickdelpo1 profile image
Rick Delpo

Hey thanks for suggesting this new framework. But I notice that we need to import a library which is 68kb almost as big as the jquery library. I use plain vanilla js because I don't want to slow down my load time using libraries. Plain JS means no libraries. PS, my JS needs are not that big anyway so I avoid all the extra fluff and also I never use NodeJS either. However, Your point is well made, avoid the complexity of React unless they require it on the job or in school.

Collapse
 
efpage profile image
Eckehard

Minified it is only 25 kB, but it´s pretty much all you need. Check out the homepage to see, if it is slow in any way, this was completely built with DML. As you do not import *ny HTML, you do not have this: "render HTML and then wait for JS to be loaded" delay.

If you like to see the bare metal, please check out the html-free-desk-calculator-app, which uses the same approach, but no library at all. This implements the main routines and has only 61 lines of code... You will find the result here

Collapse
 
efpage profile image
Eckehard

React.js: The Documentary is absolute enlighting. There have been good reasons to create react, as managing large teams was not easy this times. But this does not mean, React is the perfect fit for every family homepage...