DEV Community

I changed my mind about writing new JavaScript frameworks

Salma Alam-Naylor on October 04, 2022

A few months ago, whilst deep in a dark cloud of personal overwhelm caused by the unrelenting exponential growth of the web ecosystem, I wrote abou...
Read full post
Collapse
 
diegofranco2001 profile image
DiegoFranco2001 •

No matter how many JS framework are out there, the market will ever choose the technology with lowest cost, easy development and with more developers working with. So, why not improve the technology that we already have?. In my opinion, not only from the web dev point, there could be hundreds of framework, 3 or 4 will ever be the mainly used, and, make framework just for fun and for understand some concepts.

Collapse
 
whitep4nth3r profile image
Salma Alam-Naylor •

why not improve the technology that we already have?

An absolutely valid point!

Some people may argue that the technology we already have can be tricky to navigate. There is likely years of tech debt wrapped up in React, for example. You know how sometimes a feature gets so convoluted in production, with fix on top of fix, that sometimes it's better to rip it out and start again rather than embark upon a gruelling refactor?

I'm speculating here, but fixing what already exists may limit innovation. Then again, working within constraints is also something that can spark innovation.

There will always be pros and cons to any approach. Always two sides to the story. Always more than one approach — and each one as valid as the next.

Collapse
 
diegofranco2001 profile image
DiegoFranco2001 •

Yeah, you're right, at this point, I think that JS frameworks has become in a matter of subjectivity, maybe due to the nature of JS? 🤔, because, I've not seen other language with this situation (hundreds of frameworks). JavaScript ecosystem is a case study, something should make a thesis about this. :D

Collapse
 
whitep4nth3r profile image
Salma Alam-Naylor •

How much does a ticket cost?

Collapse
 
damian_cyrus profile image
Damian Cyrus •

I hear my senior talking:

If you don't like it: change it!

Works everywhere 😃

Good post!

Collapse
 
siddharthkmehta profile image
Siddharth Kumar Mehta •

Thanks, Salma for sharing your experience with the dev community.

Collapse
 
sm0ke profile image
Sm0ke •

nice ...

Collapse
 
inalbant profile image
Ibrahim • • Edited

While that sounds all good. In reality it's not all sunshine and rainbows.

The "platform" does not support all the features that JS frameworks provide such as SSR, partial hydration etc.

The "platform" moves at a snail pace compared to the OSS JS fws that innovate so much more quickly to offer better DX, performance and features.
Using the "platform" is so cumbersome, that the vast majority of the time you need to use other frameworks to even compose WCs and handle state etc...

Collapse
 
renhiyama profile image
Ren Hiyama •

Further, frameworks makes sure that your code can run on not so old browsers, like shadow Dom is relatively new and you probably have to add polyfills, and another example is import maps, and they're still under consideration+ not supported by every browser...

Collapse
 
h_sifat profile image
Muhammad Sifat Hossain •

Vanilla! Vanilla! Vanilla! Frameworks And Libraries are mere details. I only use them as plugins. That's what Uncle Bob taught me.

Collapse
 
artydev profile image
artydev • • Edited

I launch the #noRAV # tag : no React no Angular, no Vue :-)

Collapse
 
diegofranco2001 profile image
DiegoFranco2001 •

What should we use? XD

Thread Thread
 
artydev profile image
artydev • • Edited

All depend of your constraints.

For my personal projects I have gathered some functions I found useful in a little library.

Among those functions :

  • morphdom
  • observable, subscribe from Sinuous
  • some functions from DML

Create your own :-)

Here is an example MVU Sample

const {
  dom,  // ~<=> <div>
  udom, // ~<=> </div> 
  m,    // ~<=> document.createElement
  render, // ~<=> append
  observable, // create e reactive variable
  subscribe // reacts on reactive varible changes
} = MVU;

const h1 = m("h1");
const div = m("div");  

const state = observable({ 
  counter : 0,
  name: "wait 2s...."
})

state.get = function (prop) {
  let _state = state()
  return _state[prop]
}

state.set = function (patch) {
  let _state = state() ;
  state({..._state, ...patch});
}

function App (state) {
  const s = state();
  let view = dom()
    h1(`Name : ${s.name}`)
    h1(`Value :  ${s.counter}`)
  udom()
  return view;
}

function createApp (target, application, state) {
  subscribe(() =>  render(target, application(state)))
}

createApp(app, App, state); 

setInterval (() => state.set({counter : state.get("counter") + 1}), 900);
setTimeout(() => state.set({name: "Bob"}), 2000)
Enter fullscreen mode Exit fullscreen mode
Collapse
 
darkwiiplayer profile image
𒎏Wii 🏳️‍⚧️ •

Libraries > Frameworks