JavaScript Framework Tier List 

Legend. Thanks.

Seeing flutter as S rank is a kick on the balls.

🫡

ah thanks, I found nuxt 💚

@@t3dotgg if you edit this into the description it will replace the bad (autogenerated?) chapters

Ho ho ho!

​@@t3dotgg h0h0h0

@@t3dotgg me leaving and never coming back to this video why did you do that to astro Astro is so much better from how it looks from outside rank astro top tier plssssssssss

Next but no Nuxt?

@@rajikkali2381 it's added in towards the end (34:26)

Angular infact is the only Framework the rest are just UI libraries.

I saw him saying "It's been 3 years since I used Classes, I don't use them, it's only for library maintainers". That alone shows why he is bias.

Next is a UI library?​@@carldrogo9492

@@carldrogo9492 i think Nextjs is a framework too

I was about to say the same, simultaneously working on different projects right now and unfortunately all of them use a different UI, React, Svelte, Vue, Next and Angular, and for some reason I like angular the most because I understand it the best, find stuff in it the fastest and generally speaking I have less things to worry about because a lot of things are already in pace and defined, and documented very clearly. I don't know... it just feels right for a big application, the start is rough but once you are on the way its just so good to use. Unlike React. Started with that, and grow to hate it the most, I was fine for my home apps but I'm hating it more and more every time I get a ticket on that project. Not pleasant at all. (But that might just be due to the codebase, but the state o the codebase might just be because of React, who knows, not me.)

U mean next combines backend, I.e server components?

​@@ib_conceptNuxt

I went from Angular.js so the template syntax to me wasn't a thing. And take a HTML template and just paste it in a vue component and just change what you want is priceless

I couldn't agree more! I worked with all the major frameworks (Angular, React, Solid and Vue) but the Vue was the most joyful experience I've ever had! We're using React on job, atm but I'll try being able to write my own automation project in Vue for health sector. Long live, Vue!

I am a junior react dev trying to pick up a new framework how hard would vue be??

​@@federicodiaz7280You know that Europe is a continent, right?

I feel vue is kind of simple, the "separation of concern" in a Single File component makes it, in my opinion pretty clear of what is what. I come from a website building background (altough I've evolved) and I know my css prettymuch flawlessly. So having a , a and a tag makes the code clearer in my opinion (Its much like a Codepen project in your app) than an mix of HTML in JS (which can be powerful from time to time I must admit). The css scoping in vue make managing style easy, doesn't relly on CSS Modules or the use of tailwind (which I still use for most of my components, thanks to Daisy UI) . Scss works out of the bat if you want it. I've tried svelte, and at first I tought the syntax was like Vue but even more clear. But in the end, it's reliance on a compile step make it such as you must even make your code more complex to some area where other framework make them direct. Solid could be a Solid (!) contender if you don't mind the JSX syntax, which in my opinion solves a lot of React problems.

For my job, we are currently using Laravel Inertia with vue

I'm shocked.

They deserve to be S tier. And Vue right next to it

You can't say that AlpineJS and HTMX are a single framework (it's cheating) and combining HTMX with AlpineJS does not make HTMX better. Not to mention that you have 2 behaviors working in the same way and at the same time that they don't talk to each other. HTMX is so focused on request-based behavior that I don't understand how they call AlpineJS a complement to HTMX.

@@foot8036 ok junior

⁠@@foot8036eh, I don’t think alpine complements HTMX, but using both complements the UX and developer experience. I rather reach for an alpine function for like toggles and pop ups instead of making a round trip to the server. They complement each other well just by their nature of simplicity in a world of JS bloat.

Ya Alpine does way more than HTMX. As a long time user of Alpine, HTMX doesn't come close to the experience of Alpine and I think shouldnt be mentioned in the same sentence.

@@Nehpets94 The main point is that many comments try to rank AlpineJS and HTMX together as a single framework, which is wrong. "HTMX deserved a better rank because combining with AlpineJS..." In my opinion, as a long-time full-stack programmer and AlpineJS enthusiast since 2020, if you don't work directly with programming, HTMX could be a good choice (for you).

this is a tier list in terms of what javascript framework to use when you follow easy todo app tutorials not what framework to use when building complex enterprise ready applications that require to be stable, reliable and maintainable. i dare everyone to build a complex web application in jquery it will fail after some years when the workers shifted and no one has a clue what's going on anymore. the same with every newly hyped javascript framework that literally changes it's interfaces more often that i change my underwear.

Can i get you OF h o e?

@@amilismurfs every simpleton is after the next shinny new flavour of the month Framework and disrespect Angular.

@@amilismurfs Dude nobodys going to create a web framework with JQuery but for its impact towards the web its S tier is deserved. Jquery is still a better API than vanilla JS imo

@@amilismurfs The best frameworks make the hard things easy and the impossible things possible. JQuery did the first, and Angular did the second, and they both deserve credit for it, but neither of them are perfect. I personally still stand behind React and Angular being the best frameworks on this list simply because they adhere to general programming principles rather than the smaller set of "frontend web development" principles a lot of frameworks like Svelte exclusively stick to, but I also don't think they are better for building small client-focused apps like todo lists than Svelte.

Yea, would've liked if he took a bit more than 40 seconds to look into tools he hasn't really checked out before. I'm also confused why he says Astro isn't a framework, because "it doesn't have routing"? It has as much of routing SvelteKit has, for example. Astro can also do dynamic routing, redirects, paginating, etc. It's a tier list video, but a lot of Theos viewers will take his word as truth and assume Astro isn't a framework and that Alpine is a HTMX like framework. Even if it's a silly bait video to get interactions with the placements, I'm confident at least a good few viewers will now confidently think these things because Theo said so :p

I think you didn't understand the purpose of the video. I also think you don't know the meaning of the word variant.

@@foot8036 Could you explain how Alpine and HTMX are variants of each other for us?

@@cptive Does Astro work well for SPAs? I've only ever used it as a SSG.

He’s a sr developer not a staff arch like primagen give him a break

You haven't seen him talk about Robert Martin in his video about fake guests in a tech conference.

@@ithinkimhipster502 You're right, I guess I'm going to have to see for myself...

HTMX + Alpine can be a very attractive combination for backend developers to provide a high-quality UX while using their preferred languages on the server or even for those frontend developers who are no longer so excited about current trends and just want the simplest stack to build on their web apps. There's room for all tools. New tools are always welcome so that the industry can find new paths and improve the state of the art. We don't need to censor people for using any technology. Let people use what they like and be happy :-)

Me as well. ASTRO is S tier for me.

S tier for me

+1

I've only ever used Astro as a SSG but all of these positive comments make me want to use it to build an app.

@@semyaza555 yes the islands architecture allows you to choose which component should interactive and which should be static

Completely different. Htmx is a frontend helper framework for writing les Javascript. Qwik is a ssr framework which sends small chucks of js on every request

Yep I am mad he can't even get the new logo.

@@dgdev69 He’s pretty much your meme JS dev who has a new tech stack every other week.

He put Angular above React though

@@geniusmaker6438 I stopped watching as soon as he ranked Angular at D lol. I should’ve at least panned through to the end to see the end product though.

​@@DannyMcPfisterMee too

Yea but reactivity is one of the main things we deal with in an application that uses (for example) Vue.

Who's we?

@@carldrogo9492 "we" = who the framework is aimed at: developers. If you don't use reactivity with Vue you're doing it wrong. By asking this question I assume that you are not a developer.

also if you want to loop over some array, you can just create a {} expression which will evaluate js inside it, so you can use array.map etc, if you don't want to use #each syntax

​@@phoneywheeze9959 Can you show an example?

Angular is scalable, well-architected, and focused on each and every aspect html,js,css separately. It is integrated, and disciplined. I think the only down side to it, is relatively long learning curve. That's why people struggle with it. I used it for 7 years now, and I never gonna stop. It is way better than shitty, mixed code which is not html nor JS called JSX.

​@@arash_vazirilooks like You never builded a components

@@yajirushik2871 Angular is a component based framework, you don't know what you're talking about.

I actually did relatively large projects, with large set of components and modules, and a well-define architect. The life span of projects are more than 3 years by now. So, I know what is component, and how you can develop one in a clean, readable code , with actual separation of the concern for each section of a component. @@yajirushik2871

@@yajirushik2871 how about you component deez nuts

While I do think Svelte is improving, I unfortunately still feel like 90% of the reason behind the hype of Svelte was something along the lines of "wow you need to import useState and write 300 lines of code in React just to get a reactive variable?? Gross! Svelte does it in one line!", so I'm interested in what the response will be to Svelte introducing a more predictable system with their "runes" thing. I do agree that it's a better system, but I also think that once Svelte 5 fully releases, a lot of the initial hype which came from the "I Hate Everything Related To Javascript And The Web" crowd will disappear.

jQuery is garbage this dude is stupid

If it wasn't so boilerplatey and constantly 5 years behind on innovation, it might actually be competitive with the others.

Z

Honestly, this video seems like a troll video, I didn't follow the whole video, I skipped to the end and saw JQuery & Solid on S, Angular on D, Astro & React on F... If this is serious... lads, this video is why you shouldn't ever base anything on the "youtube programmers".

Yeah it should have been in the F tier

@@jasinrefiku2914you didn’t listen to the intro 🤦🏻‍♂️

Arent they supposed to be used together like Alpine for interactivity n htmx for server requests

you're 100% right!

Alpine.js is great for having reactivity with javascript expressions in HTML; for more complex web apps it can be used outside of HTML but it hasn't a native router and the debug experience with errors is not good so probably it has not the same goals than others SPA javascript frameworks, so in a "competition" I understand it can't be at top.

Using HTMX + Alpine has been a nice experience so far for me. They complement each other very well.

I think of Alpine as Tailwind for JavaScript. No more writing separate JavaScript files every time you need simple user interactivity. Although there is some crossover between Alpine and HTMX as far as fetching data, they really serve two different purposes and I think go great hand in hand, especially when the file size for Alpine is like 7k. If you had to write separate JavaScript files for every user interaction you needed, the file size would grow exponentially and you would have way more server requests.

I am a React dev, never used anything else. Recently I went over Vue's docs and thought to myself 'Vue is actually better than React'. I also went over Angular's docs and thought 'I would never use this'

@@draganaleksic6071 until you actually use it man :) I used vue 2 and I think it sucked

JQuery is legend for simple things, and much of websites is not required more.

@@draganaleksic6071 I can definitely appreciate that something like Angular is not for everyone and it doesn't work well for every use case. The are so many factors that go into choosing a framework for a given project or environment. It's not realistic that React is always the right answer. Theo is just so hardline biased that he doesn't really ever acknowledge the strong points of Angular. All frameworks have their strong and weak points.

yeah, Angular got better recently, that's so true, as well as it still has its fundamental problems, such as basic code complexity (boilerplate) in all kind of things, starting from basic syntax to any structures. Any way react sucks ) Suck a 🐕 sh*t library

I don't think a lot of people have used the new angular they're hyping right now, but are kinda basing it on past experiences. Framework popularity isn't entirely based on how good things are. It's based on social, economic, and ideological factors. I mean, React is not particularly good, but it's the most popular one in the west.

He has strong negative bias towards angular which is baseless. There is a reason why angular is #1 big corporate framework. 1) It has everything you need built in, 100% of your knowledge is transferable between projects. You dont have re-learn 20 libraries for each project or argue with the team which one to use. 2) its always strongly typed, you barely need to debug your code, it just works. No random runtime errors. 3) its not magical. There are some boilerplate exactly so you can see what is called, why and with which types so you know exactly how framework does things. I've worked with former react devs and they write most disgusting code I've ever seen because they got used to "it just works" mentality. It can be annoying to tinker with typescript for days to make your stuff work but in my experience, every type this happend it was due flaw in the design itself. 4) Angular is opinionated, framework tells you how to write code and how to structure your app. So you dont have to lose your mind reading other people's code. React is fun only if you are the only dev in the team.

​@@yankotliarov9239nice answer

“Baseless”? Angular was shut before the new version lol

Very new to Remix here! But i think he meant that the could not be extracted to a component as it is dependent on the actions function which is only defined on the router "component". Or is it possible to have a "UserCard" component for example that fetches its own data and can do its own mutations?

@@MrRandomgamerdkHD yes it is possible and even in severally ways I'd say. I prefer using routes In the way Theo showd most of the time. Makes it real easy to see what's going on in the page. For reusable bits there are several options. You of course do norml fetch... But I prefer a "headless" route. So a route that won't render any component, but I can connect to a form. So for instance I have an address that I can add in several places if the app, same form, same be logic. That's connected in this way. The one difference is - using useFetcher form instead of normal form. As it's easier in the code to connect the form with the route. Makes a bit more sense in this kind of scenario.

@ Nice, do you have a example of this?

@@MrRandomgamerdkHD can't share code from work, but there are some examples on using fetcher in Remix RU-vid channel. As for an exact example of what I described. I might have a moment to put something together in coming days

Yes, Angular might seem to a bit slow when you write it. But these drawback will help you clarify what the hell you are writing in 5 or 10 years.

So true 😂

dart2js bro

You thought I was Dart there all this time, but it was just js in disguise..

Actually it is transpiled to JS and compiled Webassembly, which can make it faster than every other JS application.

also alpine and htmx are great for django devs, but they are not as popular as vue, react or even svelte.

Learn JavaScript first if you don't know it, familiarize yourself with the JavaScript ecosystem Node (JavaScript runtime environment), NPM (node package manager) pythons equivalent is PIP, Express for routes, pythons equivalent is roughly Flask. You don't need to do a deep dive on these topics, but they are fundamentally important. Once you understand how to install packages quickly using npm. Go to the frameworks site that best suits your needs and read the docs. Go through the tutorials, none of these frameworks are particularly challenging. They each have pros and cons, and some have limitations when designing large scale applications. One thing that trips a lot of people up switching to JavaScript is it's a single threaded language but still asynchronous.

Popular does not men better, in my ranking HTMX is S and react,vue,svelte,etc. Are F. Htmx uses really RESTful-APIs, where all other frameworjs are just "template engines on the client"

JQuery was the React of its day, not very good, but still popular because it is better than using nothing.

@@evancombs5159 just create your some utility functions.. then you don't need to include a painful JQuery CDN.. in last 3-4 years. almost no body using it.

can i get your only fans h o e?

Yeh agree. This tier list is a bit of a joke tbh. Which is fine as I like a laugh

Is different from final result no ? Angular was doing great in the thumbnail 😂

I swear people that crap on angular like to code, they don't like to make money

​@@hamm8934but react is more in demand than angular, it's the first library framework I picked I'm considering going for Angular next

@@hamm8934 Well exactly, he isn't judging the demand. He judged Angular on how horrible it feels to use it, which is accurate imo. God forbid people actually care about enjoying what they do and not being in it solely for the money.

@@Todiros ive worked on everything from visual basic, to c, to go. You get used to whatever you use. Preferences are silly. Just focus on the power and demand of the tool. The rest is a distraction for devs that are customers for saas companies like vercel that prey on new devs fumbling through coding based on preference.

Can you make a code example?

Its just a tier (opinion) list, he could have ranked them off their color scheme, no need to take it personally.

I clicked the video because I saw flutter in S in the thumbnail. I was curious since I love flutter and honestly have done web much recently besides flutter web, but I would have expected like B teir at best for a 'web framework' tier list. Because it's a bit janky. I think it's a great decision when you are making a cross platform mobile app and want web too and are willing to compromise a bit on the web side. Seo is harder, it has quirks you have to work around. But it's also web for nearly free rather than maintaining two code bases. That gives it value I'd say, but if we ignore that, I could see D tier. It depends how you feel about JavaScript/typescript and what you're trying to do. B for situational and pros/cons D for being a poor decision in the wrong situation

Nobody can possibly speak with authority on all of these “frameworks”. So this is a meaningless exercise, although it does generate conversation, so I guess it’s a win for them. As a Vue dev, the fact that he repeatedly calls the template syntax weird (it’s valid HTML), but thinks JSX is not weird and “it’s just JavaScript”… 🤦🏽‍♂️

@@galaxyblur and on top of that the level of confidence he tells his opinion like it is a fact 👏

​@@galaxyblur the correct words are its close to javascript inside html. But yes its not just javascript at all because there are quirks

@click is not valid HTML, and is something you use in Vue, and the javascript inside JSX *is* just javascript, it doesn't have any additional syntax or features or need compilation or transpilation to remain normal javascript, what are you talking about? Lol.@@galaxyblur

@@cooltrashgamer I can understand why you might think that -- Vue's template syntax uses custom attributes that are simply ignored by HTML parsers (not validators, which check for conformity to the standard attributes and elements). But the characters used in Vue attributes are valid. Vue's own docs back this up. JSX uses a syntax that requires compilation, because it is not simply interpreted by JS runtimes. In JS, you cannot write those characters in that way without getting runtime errors.

he talked about it in his video about the developer survey

What did he say? ​@@SandraWantsCoke

@@axetroll I remember he said it's cr@p. However from my experience you should do your own tests. I've never touched it.

@@SandraWantsCoke I never saw a negative comment about it. I did try sometime ago

I needed to use with a Java backend and it was messy and verbose

I picked react as my first framework/library thinking about going for Angular next since I want to at least know one stable language suitable for big projects

My thoughts exactly.

for web he mean ig

Did he say it is a framework ? He is wrong. It is a templating library only. You are still responible for everything else. I used it with jQuery back in the day and migrated the code to Vue

It’s called “Arc” by The Browser Company

Exactly lol. Angularjs had that with directives in version 1.0 in 2013

I saw that you had a problem with angular being on D and stopped reading your comment

Astro

Obviously NixixJS for me. Blazingly fast