It is ⌚time to ditch ReactJS or Angular and use better web standards like web components😍 part 1

Michael "lampe" Lazarski - Sep 22 '19 - - Dev Community

By 2019 we all agree that components are the way to build fast, elegant and maintainable UI's. The problem is that every framework, like ReactJs, Angular(JS), VueJs, or some other smaller UI framework, uses its own patterns and solutions to common issues. These frameworks promote reusability and that they are easy to use. Also, one point I hear often is that they are mostly backed by big companies, like Google or Facebook. Let's have a discussion if this is really true, if maybe the community could do better and if there perhaps is a better alternative.

Web development is in a unique position. Web site, Web Applications, PWA's or whatever you want to call them are running in a browser, and in the end, it is all HTML, CSS, and Javascript ( and maybe Web Assembly). The goal then should be to use these tools most proficiently possible. I don't mean by that to use all of them without any kind of library or framework. You should use them, but what happens if we have too many to choose from? Overchoice happens! You are paralyzed because you have too much to chose from. Instead of being fast, you are slow because you don't know what frontend UI library to go with.

Alt Text

Okay, you now think: "I will go with reactjs every time.". This can be one solution. It can be a perfectly fine solution but still Angular, and the other UI frameworks still exist. This means that instead of working together as a community, we are fragmenting ourselves into these small communities. It gets even worse when you look that most of these tools are lacking features that we use daily. Routing in ReactJS is not fun at all. Form validation is also not fun and something nobody wants to do. So people need to create libs again for these UI frameworks, and there are most of the time like 2 or 3 libs to do these things. Not only we split our efforts into these groups of UI frameworks in these groups, but we also cut our efforts again to reinvent the wheel. Just think about the working hours we as a community have wasted here?

I can see people now think, but this is a good thing! Is it really? Please google: "Year of the Linux desktop.". Desktop Linux has the same problem. Gnome, KDE, XFCE, Cinnamon, Mate, LXDE, and man more. They all try to solve one thing: Make Linux better on the Desktop. Are they succeeding? You tell me down below in the comments.

Alt Text

Next point is reusability. Does someone remember the jump from Angular 1 to Angular 2? Yeah, it was like a completely different framework. Now we have Angular, and AngularJS which is not confusing at all. You now think, "but wait! Reactjs does not have breaking changes". You are right; they had no implicit changes like react v1 and react v2! I dare you to try to post react code where you are not using hooks! Half of the comments will be about "why are you not using hooks???". The same happened when you had to rewrite your react code from class-based components to function based components. Now I ask you a question where you have to be honest to your self and take down the "I'm a developer hat and want to use the new fancy shit" and put on the "I want to solve real problems and give people solutions they really need.". Did any of these changes really give any value to your customers? To your users? To your business? Is your code really now more comfortable to read? If you are really honest to yourself, then you would probably still be happy with class-based components. I think we can now say that maybe we have been tricked by marketing?

Wait, what? What has marketing to do with this? See people tend to forget. Who created ReactJS? Facebook, and who created AngularJS? Google. What are these companies known for? If you now say a social network and internet search then again you have the wrong hat on! They are known for advertising and marketing! If you want to know what a company is really doing is not to look at there products but how they make money.

The tail of "It is backed by a big company, so it has to be good.". I hear this so often without the person even having thought about it for longer than 1 second. This sentence promises that just because a company with a lot of money is behind the framework you are using will not go away one day. Google is famous for killing projects. There is even a website for this: https://killedbygoogle.com/. Still, want to use Angular? Okay but what about facebook? Facebook uses reactjs for a lot of projects. They are also looking for new enginers all the time and wouldn't it be efficient if the person joining your team would already know the framework lib you are using? This is something you have to decide for yourself.

I hope you now see some of the problems that we are having right now in the web development community.

How can we fix this? I personally think we already have the right way of fixing all of these problems. Standards! Yes, correct standards! The W3C is an excellent consortium, and more people from the community should be involved there. But this is a topic for another blog post.

Why do standards help us with all the issues?
When a technology becomes a standard, all major browser already have it implemented and ready to use. So this means that I, as a developer, don't need an extra library and I don't need to think about edge cases in a different browser. If there are bugs or problems, then it is in the responsibility to fix this bug for all its users. So it is in one hand to fix it not in thousands of developers hands. It would also help with the fragmentation of the community. What if you could write one component and use it in VueJS, Angular and ReactJS? Wouldn't that be fantastic? So more developer could work on one Calendar component and make it an excellent component instead of having 20 half bakes calendar components? What if all of this would happen without one big company backing this up? Instead, we as a community and all browser vendors?

What if all of this happened and we forgot?

Yes, we! The technology is called "Web Components v1".

Back in 2014, there was a big discussion if we as a community should go with web components or ReactJS. As you now know, we decided to got with ReactJS. At that point in time, it was maybe the right choice because web components were too young and the spec was not ready. That's why we call them web components v0 and we now have v1 since 2018. Now, all big players accepted this spec and have implemented it except edge (of course). Also, there are polyfills for older browsers.

So how do you use them, and how do you integrate them into your current projects?

We will discuss this next week since this blog post is already very long. See this one more as discussion and feel free to comment down below!

👋Say Hallo! Instagram | Twitter | LinkedIn | Medium | Twitch | YouTube

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Terabox Video Player