Comments by "Charles M." (@charlesm.2604) on "The Official JavaScript Tier List is Here" video.

Vue SFC approach is really neat. I hate JSX, and I hate that I have to use it. Why would you mix JavaScript and markup ? It makes for disgusting return statements. React's "just a library" lie approach* is also a waste of time, because you're gonna end up using React specific libraries without the advantage of boilerplate. On the same note, React doesn't have a powerful CLI for code generation and scaffolding like Vue and Angular. React has pseudo-functional mindset when it's not only not needed but also completely counter intuitive. Older React class based components were neat because you could take advantage of TypeScript interface implementation. Now you need to use hooks with poorly designed APIs for things that used to be super straight forward. Then you have styling. If you're going to embed HTML into JavaScript, why on earth aren't you embedding CSS in it as well ? For the love of god, make a DSL for CSS instead of forcing your users to use poor CSS-in-JS "libraries" with `template literals`, no syntax highlighting/formatting/suggestions, etc... And make it sit in your file with no purpose. Let not get me started on state management, it took I don't know how many year for the team to implement an atomic state management solution, and we still don't have proper a store API, we need to build on top of the poorly designed Context. Vue is good because it has a proper boilerplate and powerful CLI like Angular without enforcing a strict design so it's still accessible and manageable for junior devs. In addition to official libraries for routing, state management, testing, etc... And Vue has a great SFC design to keep views, styling and business logic separated but still closely connected. Model, expression, binding directives, etc... are so much better than throwing some JavaScript code in a JSX statement, I mean have you seen loops and conditional rendering in React? 🤮
5
@AlexanderSemenovForever Entreprise-scale return statement: return ( <ul className="p-5 list-none flex flex-col gap-2"> {(myList.map(item => { return ( {item.isPublished && ( <li key={item.id} onClick={() => setMyList(old => old.filter(oldItem => oldItem !== item))} className="cursor-pointer hover:text-red-500">{item.title.substring(0, 50)}...</li> ) }) } </ul> )
1
@AlexanderSemenovForever That's exactly my point, React and JSX in general make for bad design. If you're going to make enterprise scale projects you have no room defending React. You'd go for Angular or Vue. The same component in a vue SFC: <script setup lang="ts"> const myList = ref<ItemType[]>(); function removeItem(item: ItemType) { myList.value = myList.value.filter(oldItem => oldItem !== item); } </script> <template> <ul> <li v-for="item in myList" v-if="item.isPublished" @click="removeItem(item)" > {item.title.substring(0, 50)}... </li> </ul> </template> <style scoped> ul { padding: 1.25rem; display: flex; flex-direction: column; gap: 0.5rem; list-style-type: none; } li { cursor: pointer; } li:hover { color: red; } </style> As for server-side sessions, an enterprise scale application should use an in memory KV store like Redis or MemCache, but Nuxt3 DOES provide out of the box support for sessions through its use of vuex, it's one of the first concepts they introduce in the docs so I find it crazy that you missed it. This is also how they support authentification, through vuex stores and middlewares. Although there are 3rd party community plugins and libraries for auth intregations as well.
1
@AlexanderSemenovForever The thing is you can use the composition API in vue2 and librairies are now made with vue-demi as a standard so they are compatible with both vue2 and vue3 projects. If they already had an existing codebase in vue2 I don't think they should be forced to migrate for now.
1