DEV Community

loading...

Is it better to use JS libraries/frameworks or not?

leviathanprogramming profile image 𝐋𝐄𝑽𝐈𝑨𝐓𝐇𝐀𝐍 Programming ・1 min read

Lots of people told me to stop using jquery because it was inefficient so I did. I know how to use react and stuff like that, but I don't usually use any libraries, frameworks, or dependencies besides Font Awesome Icons and Google Fonts.

Some of my friends told me a way to "re-create" the jquery dollar-sign function like this:
const $ = (tag) => document.querySelector(tag);
That's what I use and I mostly just code in pure DOM with that as my helper.

I know lots of people use stuff like React, and Angular, but is it more efficient to do so?

I mean, adding a dependency or library to your project sometimes comes with code you won't use. Will using something like React make your site slower or be equally the same as using no libraries at all?

I just want your opinion on what is the best, fastest way to develop websites: with or without libraries/frameworks.

Thanks for reading!
Happy coding!

Discussion (24)

pic
Editor guide
Collapse
webbureaucrat profile image
webbureaucrat

There's definitely no right answer, but a few thoughts:

  • Efficiency is a little overrated. Connections are pretty fast these days, and even bottom-of-the-line phones aren't that bad.

  • Yeah, you probably don't need JQuery anymore, as long as you're targeting reasonably modern browsers.

  • In my humble opinion, everyone who's working on the web platform should learn vanilla JS in-depth.

But for the most part, you're just going to have to learn to use the right tools for the job. I recommend using vanilla JS as much as possible for a while so you get to really know what it's like to use it. If you're writing a web app that you know up front will have a whole lot of interactivity, it may not make sense to start with truly vanilla JS, but you can start by bringing in one framework and stick to that.

The important thing is: Don't bring in any dependencies just by default. If you start every app thinking, "I need to install a bunch of libraries and plugins and then start writing code" and then add more over time on top of that--that's where your app will really start to slow down.

Collapse
leviathanprogramming profile image
𝐋𝐄𝑽𝐈𝑨𝐓𝐇𝐀𝐍 Programming Author

Yeah, I always make sure that I only use the dependencies I need.
Thanks for the info!

Collapse
codefinity profile image
Manav Misra

W/o some framework, many times you are 're-inventing' wheel every time. So, if may take 5-6 hours to do 2-3 hours of 'real work.' With the deadlines, it may not be feasible.
But, it is very important to learn 'vanilla' 🍦 first - not to just get caught up and 💯 reliant on these libraries/frameworks.

Collapse
leviathanprogramming profile image
𝐋𝐄𝑽𝐈𝑨𝐓𝐇𝐀𝐍 Programming Author

So you are saying that it is better to use libraries and/or frameworks even though some features provided are unnecessary?
Will using any dependencies decrease the speed of my website?

Thanks for the info, btw.

Collapse
hamdano2 profile image
hamdano2

On some days I ask if this is more efficient than how things were done before too. But now that I reflect on it yes.

React makes it easy to make reusable components (if you bother). So when you start things will be slow. But when you have/created some good components that you like then you can really notice the difference.

Collapse
leviathanprogramming profile image
𝐋𝐄𝑽𝐈𝑨𝐓𝐇𝐀𝐍 Programming Author

I was never a huge fan of react but I guess I should start using it a bit more now.
Thanks for the info.

Collapse
shadowtime2000 profile image
shadowtime2000

About the recreating JQuery thing, I believe some browsers, if there is no $ in the global scope, set $ = (tag) => document.querySelector(tag); anyways. I find frameworks useful for organizing my code and I also am not a fan of writing entire applications with document. methods.

Collapse
leviathanprogramming profile image
𝐋𝐄𝑽𝐈𝑨𝐓𝐇𝐀𝐍 Programming Author

I can use frameworks to do stuff but I honestly think that using the DOM is pretty simple. It does make sense that there are better ways to do stuff with frameworks.
Thanks for the info.
Happy new year!

Collapse
shaileshcodes profile image
Shailesh Vasandani

Great question! I find that I only reach for frameworks for larger projects that really benefit from the reusability and encapsulation that they provide.

For example, for an enterprise application I'm working on, I'm using React because there are a lot of moving parts and reused components.

For a small portfolio I made for a client, though, I used plain JavaScript — even if it meant I had rebuild some routing functionality myself.

At the end of the day, I think there's nothing wrong with using frameworks; using vanilla JS gives you way more control, but you'll have to do more work.

In any case, thanks for sharing! I think it's super useful for newer developers to see that there are lots of people working just with vanilla JS, especially when they can get overwhelmed with all the different frameworks currently available.

Collapse
jonrandy profile image
Jon Randy

Completely depends on what you're building. There's a huge tendency these days to reach for stuff like React when it's simply not needed. So many sites have a ton of JS dependencies, when a few lines of vanilla JS here and there would have sufficed

Collapse
gneissguise profile image
Justin Frost
const $ = (tag) => document.querySelector(tag);
Enter fullscreen mode Exit fullscreen mode

This is a pretty handy alias for querySelector!

There are some nice things about jQuery's $ selector function though.. namely the ability to create tags and attach them to existing Dom nodes in one line. (Lots of cool one liner chained functions are possible!)

It also has some more neato advanced Dom traversal features, and more entensive selector syntax. Now that I think about it, you can even just the jQuery $ func as an analog to document.onLoad!

Some may say it's bloat, and may point to alternative ways to do the same things in vanilla js, but it's nice that jQuery has it all in one, and is pretty easy to learn. No need to sit down and learn an entire framework just to have the ability to make dynamic changes to existing html page! It even comes in a variety of min bundles and cdns making it easy to source.

Would I want to build an entire stateful front end web application with only jQuery? Hell nope.

Collapse
pengeszikra profile image
Peter Vivo

I vote framework / libraries instead vanilla js, even pure js is great, but when mix js with html/css - 98% of times - then we shortly find ourself even single medium complex webpage creation still lot of extra work.
My favourite framework is react ( preact if builded size is important ), which one give the power of development application without mandatory write html files. Plus get a great structure of component and one way data binding.

Collapse
alaindet profile image
Alain D'Ettorre

Avoid jQuery. Since you're young, don't focus on frameworks yet, because by the time you'll have a job a lot will have changed. My advice is to focus on building projects of your own and understanding concepts, maybe even read the code of famous frameworks (they're all open source). Since you like vanilla JS, give Web Components.

I strongly suggest to use Git and properly version your code, that will never be outdated. By doing so, you record your journey and you can also show the world your projects via GitHub, Gitlab or BitBucket.

Collapse
dennisfrijlink profile image
Dennis Frijlink

For productivity yes, for learning new things/evolving your skills no

Collapse
aayushk47 profile image
Aayush Kurup • Edited

I am not highly experienced in react but I don't really think that react makes sites slower. It's just around 100 kb and provides a way to divide your web page into components and work on each of them independently. It's definitely better than angular cause angular projects are hhhhhhhuuuuuuuuugggggggggeeeeee.

Anyways if you are worried about your project size, there is a very cool web app called bundlephobia which computed the size of your project on adding an NPM library.

Cheers.

Collapse
aaely profile image
aaely • Edited

I find myself primarily using react with minimal dependencies. Web3 for dApps. Graphql to hit MongoDb straight from my front end. Django or Strapi to spin up a quick API. But other than that, it's pretty much vanilla and built in react. I don't even end up using redux as I prefer passing the props down through components. I'm starting to use Recoil with dApps because of the nature of Solidity, however. But you can do a lot of vanilla with the snappiness of virtual DOM and ease of component structure by using react. Plus, and my primary reason for choosing react over vue, react-native. That's the deal sealer for me, truth be told.

Collapse
tfantina profile image
Travis Fantina

React and to a lesser extent Angular are hugely popular frameworks these days but they are generally targeted at creating performant frontends and single-page applications because they handle a lot of DOM manipulation and updates for you.

It's all a question of what your goals are, if you want to learn the language Javascript and learn it well you should check out eloquentjavascript.net/, or freeCodeCamp (beginner-friendly) and then github.com/getify/You-Dont-Know-JS/ (fairly adnvaced).
But if you are interested in building backends with authentication building APIs, information systems, that sort of thing then you should look at NodeJS and a framework like ExpressJS which allows you to do that.
If you want to create performant and engaging front ends it's definitely worth learning React or another front end framework, like Svelte (which I think is a bit more beginner-friendly).

Whatever your goals are you should definitely get a familiarity with the basics of the language Javascript. Some people want to build a foundation first before looking to build more complex applications with frameworks or libraries, others would prefer to dive in and learn as they go. There isn't really a right or wrong whatever works for you is right.

Collapse
leviathanprogramming profile image
𝐋𝐄𝑽𝐈𝑨𝐓𝐇𝐀𝐍 Programming Author

I am pretty skilled in Javascript. I use mostly just plain HTML, CSS, and JS to do my coding. I also do backend with socket.io and Flask (python backend framework).

Collapse
dumijay profile image
Dumi Jay

I went through the same question years ago,

Here's my two cents.

The fastest way to code: Using libraries
The fastest code execution: Using native/vanilla language features & APIs

But, you should also consider the time it takes to learn new libraries/frameworks. Switching between so many frameworks and their documentation is taking a lot of time (we usually don't account for it)

Plus, depending on libraries (like jQuery) too much moves you away from the real magical stuff under the hood.

There is no definite answer for this. It depends on the nature of your work. However, learning the inner-workings of any language is always an investment with an exponential return.

While working with libraries for production, I recommend you to make your own set of libraries. I know it's re-inventing the wheel. But in this path, not only you get better in coding, but you also pick up super-powers to quickly learn other frameworks.

That's what I did for most simple stuff. For example, packed most essential jQuery features I needed to a tiny 1KB library. For complex requirements, using specialized frameworks is obviously more productive.

Plus, check out youmightnotneedjquery.com

Collapse
leviathanprogramming profile image
𝐋𝐄𝑽𝐈𝑨𝐓𝐇𝐀𝐍 Programming Author

Thanks a lot for the info. This is very useful. I don't use jquery anymore, just coding in raw HTML/CSS/JS.

Collapse
madza profile image
Madza

Nowadays the time is money, so, to stay competitive and meet the deadlines, we simply can not afford coding vanilla anymore 🕒💸

Collapse
jonrandy profile image
Jon Randy

This is precisely why so much modern code is so bloated and inefficient

Collapse
leviathanprogramming profile image
𝐋𝐄𝑽𝐈𝑨𝐓𝐇𝐀𝐍 Programming Author

Thank you so much for the response. This was the exact answer I was looking for.
Happy coding and Happy new year!