VoliJS / NestedReact

BackboneJS compatibility layer for React-MVx MVVM framework.
https://volicon.github.io/React-MVx
79 stars 5 forks source link

ES6 classes support #16

Closed feorex closed 8 years ago

feorex commented 8 years ago

Hi! Does NestedReact support ES6 classes? If not, are there corresponding plans? Thanks!

gaperton commented 8 years ago

Currenty - no, as it does a all the magic inside of overridden createClass.

ES6 classes support is planned and will be released soon (it will also bring powerful mixins, as we cannot migrate to classes without the full createClass feature set support). It will require ES7 decorators, or manual MyComponent.define({ ... }) call after definition. Till the end of August, may be earlier.

gaperton commented 8 years ago

In fact, I'm working on it right now. It's the part of very big major update - we will have entirely new transactional state management core written with TypeScript. Here. https://github.com/Volicon/Type-R

feorex commented 8 years ago

Cool, thanks for response! Looking forward to use it when it's ready!

gaperton commented 8 years ago

NestedTypes 2.0 alpha with ES6 classes and mixins support is ready. Tomorrow I start working on NestedReact 1.0 alpha. We're close to release. Timeframe is "weeks". That's gonna be the best UI framework ever created - NestedTypes 2.0 is a speed demon. It's several times faster than current version, and, I suspect, is the most performant serialization and observable solution ever created for JS.

At the same time, Models and Collections retains 99% API compatibility with Backbone. Which is fun - it's incredible how much can you get with different implementation of the same API. :) Now we're at least 10 times faster than Backbone in every browser, including IE11. 10 (ten) times.

gaperton commented 8 years ago

So. That's how it will look like.

@define
class MyComponent extends React.Component {
    static state = {
        a : 1,
        b : MyModel,
        c : MyCollection
    }

    render(){
        ...
    }
}
gaperton commented 8 years ago

Or like this:

@define({
    state : {
        a : 1,
        b : MyModel,
        c : MyCollection
    }
})
class MyComponent extends React.Component {
    render(){
        ...
    }
}

I, personally, prefer the first option. But both will work. That's how Type-R metaprogramming works - it doesn't matter how exactly you execute define. Another way (closer to implementation) is like this:

class MyComponent extends React.Component {
    render(){
        ...
    }
}

MyComponent.define({
    state : {
        a : 1,
        b : MyModel,
        c : MyCollection
    }
})

That's what will be invoked after all. All three will do the same dark magic - transform class definition on inheritance in the way, that you will enjoy the result :)

gaperton commented 8 years ago

Have to make a note to my future self - make sure, that mixins spec also works with statics. Cause it's beautiful.

gaperton commented 8 years ago

ES6 classes are in develop. Look at TodoMVC.