Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Vue.js is Wikimedia Foundation's future JavaScript framework

lists.wikimedia.org

Post reply on HN
Print view View original

51–60 of 204 posts

Re: Vue.js is Wikimedia Foundation's future JavaScript framework

#51

Post by zkldi »

I feel like I'm in an alien world when it comes to Vue - it has this weird pattern of making strings do loads of heavy lifting.

The Github Commits[1] example on their documentation has a load of stuff that just doesn't sit right with me.

Things like

    v-for="record in commits"
to loop over something is insane to me - this isn't code, this is a string inside a html attribute! How can you get any sort of good type analysis/variable checking/syntax highlighting inside this?

Similarly, accessing properties like

    :href="record.html_url"
has the exact same issues - what if there's a typo here? My IDE can't highlight that this is wrong because it's *not code* and is just a string.

Maybe I'm just the odd one out here, but vue (and angular) love to use strings as a makeshift programming language, which to me is a major smell.

^[1]: https://v3.vuejs.org/examples/commits.html

Re: Vue.js is Wikimedia Foundation's future JavaScript framework

#52

Post by AbuAssar »

zkldi wrote: post #51

I feel like I'm in an alien world when it comes to Vue - it has this weird pattern of making strings do loads of heavy lifting. The Github Commits[1] example on their documentation has a load of stuff that just doesn't sit right with me. Things like v-for="record in commits" to loop over something is insane to me - this isn't code, this is a string inside a html attribute! How can you get any sort of good type analys…

This is not a regular string, it is a template. And the tooling handles it just fine.

You get type checking, linting, syntax highlighting etc.

Re: Vue.js is Wikimedia Foundation's future JavaScript framework

#53

Post by zkldi »

AbuAssar wrote: post #52
zkldi wrote: post #51

I feel like I'm in an alien world when it comes to Vue - it has this weird pattern of making strings do loads of heavy lifting. The Github Commits[1] example on their documentation has a load of stuff that just doesn't sit right with me. Things like v-for="record in commits" to loop over something is insane to me - this isn't code, this is a string inside a html attribute! How can you get any sort of good type analys…

This is not a regular string, it is a template. And the tooling handles it just fine. You get type checking, linting, syntax highlighting etc.

If it's a template then it's a very complex one, and under closer inspection it reads almost like storing code in a string and evalling it.

Let's say we want to iterate over commits in reverse. A google shows that we can do something like this:

    v-for="item in items | orderBy 'field' -1"
So, there's pipes now, and Vue has essentially re-invented a programming language inside HTML attributes. But then comes this example below it:

    v-for="item in _.reverse(items)"
And this line is terrifying! If this string is able to use lodash, then that means it's able to access the JS global scope, and therefore is very powerful - yet the resulting template is nonsense js, but still at some point involves JS evaluation?

Maybe I'm missing something though - I don't use Vue and if something is this big with this approach, I'm definitely missing something.

EDIT: A search for *new Function(` calls in the vue github repository shows quite a lot of code that essentially evals strings.

Re: Vue.js is Wikimedia Foundation's future JavaScript framework

#54

Post by kyawzazaw »

finiteseries wrote: post #39
avaldes wrote: post #37

Earlier quoted context omitted.

What happened to emberjs? It was poised to become the next big thing after react and angular and suddenly nobody talks about it anymore.

It’s still around a bit. It was a hulking, omakase, MVC? based framework at a time when the oppo was Angular 2.0 & Backbone.js and people still used Bower, then React threw everything on its head in favor of component libraries while NPM came into the mix. They eventually refactored in components and I think repackaged everything for the new js fe ecosystem, but the battle was already lost.

LinkedIn uses it

Re: Vue.js is Wikimedia Foundation's future JavaScript framework

#56

Post by Exuma »

zkldi wrote: post #51

I feel like I'm in an alien world when it comes to Vue - it has this weird pattern of making strings do loads of heavy lifting. The Github Commits[1] example on their documentation has a load of stuff that just doesn't sit right with me. Things like v-for="record in commits" to loop over something is insane to me - this isn't code, this is a string inside a html attribute! How can you get any sort of good type analys…

Vue is brilliant when you actually use it. Nothing you've mentioned is remotely ever a problem in my experience. Also :href="xxx" isn't a string, that is javascript in there.

You won't ever have more than 10 characters at most in an attribute, and if you do you make a method for it and call the method.

The other alternative is JSX type stuff in react where you are injecting full JS into the templates which is like committing seppuku to me. Vue is so much nicer to use than react IMO, and I've used both extensively.

Re: Vue.js is Wikimedia Foundation's future JavaScript framework

#57

Post by sebasslash »

sativallday wrote: post #36

Love Vue. Polymer 2.0 with its HTML imports still offered a better DX in my opinion. Svelte offers a better DX than both of those frameworks. I don't even bother with FE anymore, more focused on BE/infra - but Svelte is always a pleasure to work in.

Agreed, Svelte is by far the most productive FE I’ve used. Coming from a jQuery/templating background, at first felt Vue was the most intuitive to use (React felt alien, Angular overly verbose)…

Until I met Svelte…Vue, minus the BS. A clean template system, less boilerplate, no Virtual DOM, nice Typescript support, intuitive state mgmt.

10/10 my goto for any frontend project.

Re: Vue.js is Wikimedia Foundation's future JavaScript framework

#58

Post by zkldi »

Exuma wrote: post #56
zkldi wrote: post #51

I feel like I'm in an alien world when it comes to Vue - it has this weird pattern of making strings do loads of heavy lifting. The Github Commits[1] example on their documentation has a load of stuff that just doesn't sit right with me. Things like v-for="record in commits" to loop over something is insane to me - this isn't code, this is a string inside a html attribute! How can you get any sort of good type analys…

Vue is brilliant when you actually use it. Nothing you've mentioned is remotely ever a problem in my experience. Also :href="xxx" isn't a string, that is javascript in there. You won't ever have more than 10 characters at most in an attribute, and if you do you make a method for it and call the method. The other alternative is JSX type stuff in react where you are injecting full JS into the templates which is like co…

> :href="xxx" isn't a string, that is javascript in there.

This is the part I don't really follow, though. Technically:
href here isn't a string, it's python, but it's stored as a string, representing python. In the :href example for JS, that's not JS - an engine isn't seeing that - that's a string that is evaluated as JS at some point in the vue lifecycle.

Re: Vue.js is Wikimedia Foundation's future JavaScript framework

#59

Post by dcgudeman »

ricardobeat wrote: post #34
ggregoire wrote: post #21

Earlier quoted context omitted.

Although I understand what you saying about big shifts and kinda shared your opinion, specially about hooks, I started a new project from scratch last week and decided to give hooks a try (and, for reference, I've been using React on a daily basis for 5 years). Oh boy I was wrong. Hooks are way more easier and intuitive than what I thought. It makes code so much more readable and easier to reason about. Especially wh…

I've been through two large-scale projects now where we went 100% into hooks, and after a couple years the excitement has faded and I often wonder if it was worth it. It seems to end up making code even more complex than before, even though components look simpler on the surface. Not enough to go back to classes, but doesn't feel as good as those first steps. I absolutely hate the manual dependency tracking and havin…

Is it really that bad? eslint-plugin-react-hooks installs by default when creating a project with create-react-app, which basically does the work for you.

Re: Vue.js is Wikimedia Foundation's future JavaScript framework

#60

Post by Drew_ »

zkldi wrote: post #53
AbuAssar wrote: post #52

Earlier quoted context omitted.

This is not a regular string, it is a template. And the tooling handles it just fine. You get type checking, linting, syntax highlighting etc.

If it's a template then it's a very complex one, and under closer inspection it reads almost like storing code in a string and evalling it. Let's say we want to iterate over commits in reverse. A google shows that we can do something like this: v-for="item in items | orderBy 'field' -1" So, there's pipes now, and Vue has essentially re-invented a programming language inside HTML attributes. But then comes this exampl…

I don't know if you haven't had much experience with templating engines, but having the ability to write programmatic expressions to make a layout dynamic is a basic necessity that pretty much every known templating engine has. "It reads like storing code in a string and evalling it" sounds very funny in this context because that's exactly what every solution does and it works pretty well in practice.
Post reply on HN