meteor / blaze

:fire: Meteor Blaze is a powerful library for creating live-updating user interfaces
http://blazejs.org/
Other
526 stars 114 forks source link

Vue as Blaze 2.0 #131

Closed aadamsx closed 3 years ago

aadamsx commented 7 years ago

Thinking ahead to Blaze 2.0, I think we should be talking about somehow building off of Vue 2.0 https://github.com/meteor/blaze/issues/128#issuecomment-251184658 instead of duplicating efforts or talking ourselves in circles feature after feature, and getting sidetracked or bogged down.

We need to be looking at the big picture. Vue has the momentum in the broader JS community. Vue has the features we've been asking for and need. Vue has the performance. Vue has developers working full time on the project. Vue has tempting similar to Blaze. The only thing it's lacking is tight Meteor integration and maybe a sprinkle of Blaze flavor we are use to around these parts.

I think we should be discussing how to build off Vue with a emphasis on Meteor -- as a "Blaze 2.0".

I think the timing for a move like this is just right:

mitar commented 7 years ago

Blue is a nice name. :-) But probably hard to search for on Google. :-)

daquinons commented 7 years ago

@mitar Maybe Vlaze then 😎

Akryum commented 7 years ago

I need to sort data context and template inclusion params out before publishing anything.

aadamsx commented 7 years ago

If we can help you somehow, please let us know.

Akryum commented 7 years ago

I need some free time. :p

SpyridonZ commented 7 years ago

If this requires some transpilation to achieve Blaze-like syntax, why Vue specifically and not one of the above?

Well, aside from the performance improvements, I believe it has a few other advantages.

One of the biggest improvements IMO is it's not as opinionated, so it should be a bit easier to adapt it to Blaze syntax and allow users to use Blaze the same way they used to - while also allowing them to integrate Vue's features with a lower chance of major changes being needed. It basically offers "more options" to users, where using Blaze or React alone is a bit more restrictive.

I mean sure, it's "possible" to use React without JSX if you want, but you are giving up a lot of what makes React. Where in Vue, you aren't losing out on anything if you use JSX or not.

It's also more lightweight than React. Which is very useful considering how Meteor's loading.

chompomonim commented 7 years ago

I'm afraid that such big change would make Blaze2 backward incompatible. Will it be possible to use such packages as aldeed:autoform if vuejs will be used under the hood?

mitar commented 7 years ago

Reporting on progress.

I just finished porting Tracker to Vue's observer. Vue has a similar concept to Meteor's Tracker and it is so similar that mostly there is just API difference, while semantics are the same. I made a Tracker API wrapper around Vue's observer. It is 100% compatible with Tracker. Now one can use all Meteor code directly in Vue and get all reactivity you were used in Blaze, with all benefits of Vue.

For now, it requires a forked version of Vue. Pull request is here. Please upvote it to show support.

More of my ideas of how I think Vue could be integrated with Meteor is here: https://github.com/Akryum/vue-meteor-tracker/issues/3

Feedback welcome. Help as well. I slightly remember that somebody already did a version of Minimongo which uses getters to register dependencies on Tracker, instead of having developers specify fields precisely to limit the reactivity. Does anyone remember that? Or maybe I was just pipe dreaming.

Blaze 2.0 could then be just a syntax preprocessor for Vue, similarly how Jade is already supported. Search for "jade" here. So one could do <template lang="blaze"></template>.

Example app: https://github.com/mitar/vue-test. Notice how I can use Meteor ReactiveVar inside computed value directly.

mitar commented 7 years ago

It would be great if Meteor supported overriding packages. Because for now the only way to override the package is to put it inside packages. But this is not really a nice way to distribute this new implementation of Tracker.

daquinons commented 7 years ago

So is this finally where Blaze 2.0 is going? πŸŽ‰πŸŽ‰

I'll try to summarize what's missing to make this happen. There are different issues and repositories involved so maybe it's easier for everyone to follow the progress (correct me if I'm forgetting something):

gcacars commented 7 years ago

You know? https://svelte.technology I think that we could use it when build the new Blaze Vue for better perfomance and low weight.

mitar commented 7 years ago

Hmm, not sure what is this different from what Blaze and Vue do? They can both compile template to a function at compile time and then you use only that. They still have a runtime code which is shared between those compiled functions, but this is OK. (Vue also has an optional way to compile on the client, but you do not have to add this compiler to your client side.)

mitar commented 7 years ago

@aadamsx, I made one more pass on the benchmark and I noticed that you implemented Vue with stateless components, while React was using stateful components. So it is not really realistic comparison. (React also supports stateless components and we should probably then compare stateless React components with stateless Vue components.) I added stateful Vue test case and it seems it performs slightly worse than React.

See results in the updated benchmark's README.

filipenevola commented 3 years ago

I'm closing this issue because it's too old.

If you think this issue is still relevant please open a new one.

Why? We need to pay attention to all the open items so we should keep opened only items where people are involved.