Do you really need Javascript frameworks for simple tasks?

Hello everybody, hope you doing well! :=)

Usually when you don't go with CSS frameworks like Bootstrap, Materialize, etc. you have to build functions like dropdowns, collapse items on your own which can be a pain in the ass.

Around 7-8 years ago jQuery was a thing, a few years ago we've started to see frameworks like React, Vue.. nowadays trend in Svelte (which I really like).

Let's imagine the situation you have your own CSS framework/style, and you need to build collapse item.

Sure enough, with jQuery, it's gonna look like this:

$("#my-collapse").show();

With, for example, Vue.js:

<template>
  <div v-show="isVisible"></div>
</template>

<script>
export default {
  data() {
    return {
      isVisible: false
    };
  },
  methods: {
      toggleVisiblity() {
          this.isVisible = !this.isVisible;
      }
  }
};
</script>

Question is.. do you really need a bunch of library/framework code just to make some toggling work..?

Let's get back to the toggle example. All you need is something like this:

window.toggleCollapse = (target) => {
    return document.getElementById(target).hidden = !document.getElementById(target).hidden;
}

I mean with modern JS, this could be one-liner:

window.toggleCollapse = target => document.getElementById(target).hidden = !document.getElementById(target).hidden;

Now within your code, all you have to give it the id of element, or selector in case you go with that.

<button onclick="toggleCollapse('main-mobile-menu')">

That's it, no massive JS libraries and etc.

Now don't get me wrong, for anything more complicated I'd definitely go with some framework, but for simple stuff, you don't need it.

Funny thing is, for collapsable you don't even need Javascript. Check <details> tag.

<details>
    <summary>Details</summary>
    Something small enough to escape casual notice.
</details>

Above code will act as collapse natively. Check more here: developer.mozilla.org/en-US/docs/Web/HTML/E..

Best of luck!

Enyinna Ibekwe's photo

It all depends on what you foresee about the project in future. Using a framework gives a better roadmap to scaling upwards and sideways; also a new finger can get started with extending your code in no time if it were written in the guide of a framework.

Tho bottom-line is that "the size of the project tomorrow" is to tell what you use today.

dhanushka madushan's photo

I'm agree with you for some extent.

But framework was built to create large project. Not to develop "Hello Wold" applications. Developer needs to decide what type of framework should be selected based on the requirements and scalability of the application.

If someone willing to write a simple application, then light weight framework such as JQuery would be fine. These frameworks are simple and smaller in size. If someone need to write a large application, then developers need to decide to go for a proper framework.

If the application is smaller, then you can write your own framework. I know few companies started with their own framework and finally ended up with large framework which is overhead for them self. Well known law of Software Engineering is that "Do not re-invent the wheel". Therefore, I'm recommend to reuse libraries as much as possible.

Carlos Caballero's photo

The quick answer is NO! You don't need a framework to do simple task.

Benjamin Beganović's photo

Indeed, frameworks are built for large projects, but you must be living in another universe if you don't see that people for HelloWorld + Animation use the complete framework, cheeeeeers!

Tan Yeong Sheng's photo

I see frameworks like Phoenix LiveView, it could probably replace 80% of SPA type JS front-end solutions

cedric simon's photo

I agree with you.
TIL about <details> tag, but it is not supported in IE and Edge, which are required to all our projects.

That's why we can't have nice things.

Benjamin Beganović's photo

Pretty sure you can stop caring about IE, however Edge is powered by Chromium now, should make a difference.

Megida Dillion's photo

IMO, care about IE. Your user may be an IE fan, and he won't be able to access your site adequately if you don't care about him.