Transitioning from blaze to new view layer, need recs

I’ve built a quite complicated app on top of blaze, and in general I am very happy with it, despite it being a little long in the tooth these days.

There are a few things I wish I had though, so I was looking for some recs at which tool I might want to look at next.

The main things that I find I generally want in my next view layer are:

-template inheritance, so that one child template could inherit properties and functions from some base parent template

-easier access to variables inside child templates. I know there are several ways around this and I use many of them, like using a shared reactive variable, using session var, getting data from the router etc. But sometimes it would be great to be able, from a parent helper or event, to just query a variable that the child tempalte has defined

-similarly, the ability to execute a function defined in the template. For example, having a parent form template and lots of children templates representing elements, it would be nice to tell each child element to clear itself (or similarly defined functions)

-The ability to have the new system live peaceably alongside the old one during my transition

-plays nicely with flowrouter, has serverside rendering options

I know react is the new hotness, but I’m interested in what my other options are that provide the above features as of 2020. I don’t need a framework that promises automagic forms and widgets…I have had no issue building my own widgets in blaze incorporating other npm libs like selectize, ckeditor, my own version ‘editable’ widgets etc, so the less the view framework tries to do, the better.

thanks,
Cliff

I’ve been playing with Svelte and Sapper(Svelte with SSR). It’s awesome. I just was going through the tutorials on meteor and svelte today. The problem Is I hate the fact that you have to add all these different packages to get something to work. Idk maybe it’s just me. But def check out Svelte.

Will be moving from blaze to svelte in the not too distant future. In many ways, it feels like the spiritual successor. Others have already demonstrated that blaze and svelte can work together if needed as you’re moving things over. The one big issue is there seems to be a problem with Cordova at the moment. See: Has anybody tried svelte mobile?

Vue in Meteor is well maintained and its community is really nice. Its creator Evan You used to be a Meteor developer.

I’m about to release a new version of the Vue meteor guide

3 Likes

react evangelist here, so i want to share my opinion:

so the less the view framework tries to do, the better.

That is react for you, it just does the viewlayer and does it right, never stands in your way.

-template inheritance

You actually don’t do that, at least not in Component driven design and most UI framework theses days are component based. You do instead “composition”: you compose bigger components from smaller ones. And if you just need to have a shared piece of function, just import it and use it wherever you need. in react, everything is javascript code, there is no template language. You build and compose with code. That makes it very powerful, once you get the hang of it

easier access to variables inside child templates

you pass either properties to child-components or you use some shared context, in particular if you need shared state. Speaking of which…:

to just query a variable that the child template has defined

react and i guess many other framework forbid this: it’s against component encapsulation. You can always communicate with callbacks to parent components or you use a shared context.

similarly, the ability to execute a function defined in the template

this comes naturally in react, its just code (with jsx as syntactic sugar). Probably all major view frameworks support that. Back when i used Blaze, this was also my number 1 missing feature!

it would be nice to tell each child element to clear itself (or similarly defined functions)

that is also something to avoid in general. Most view-frameworks allow you to express your UI in a declarative way. Components have props and the props define their look and behavior. So you “communicate” to children via props. You can’t execute a function an a child (in general, there are exceptions), the child’s behaviour should only depend on the properties that you pass to it (and maybe some shared context state). If the child has some internal state, that you want to “clean” up or so from outside, its better to pass that state from outside to the child as props, so that the child is stateless.

The ability to have the new system live peaceably alongside the old one during my transition

this has been done successfully with react and blaze, i guess its also possible with the other view libraries. Of course it usually results in an increased bundle size.

plays nicely with flowrouter, has serverside rendering options

I have an older project with flowrouter and react, that works nicely. SSR works of course only if you directly mount react-components with flow-router (or other routers), not when you use react inside of Blaze-templates as blaze does not support SSR. Also be prepared that SSR needs additional boilerplate

I have been using React ever since it got out, I think blaze is much cleaner and better.

This is personal opinion, blaze it a lot like handlebars, nice and simple.

1 Like

Imho I’m more experienced with React, but I love Vue way more. React is requires a lot of boilerplate and its community is rather splintered. React’s core is tiny and all the deps like router, state management, etc are 3th party meaning things break often (luckily its less the case these days) and that people need to wire things up themselves is awful to say the least

In Vue it just works. When packages become important enough (like vue-router) they become part of the inner circle of core maintainers. Its docs are outstanding and very well maintained. Have you seen the new Vue 3 docs? https://v3.vuejs.org/guide/migration/introduction.html

React is nice, but honestly, an objective look at what Vue does, how nice its community is, how everything just seems to be cohesive and how easy it is to introduce into existing projects…

You take your pick, but if you really want to be productive I would place my bet on Vue

3 Likes