Git Product home page Git Product logo

Comments (6)

christianalfoni avatar christianalfoni commented on August 23, 2024

Hi there @jolafrite and thanks for the feedback! :-)

  1. That is a good point! Yeah, I will definitely consider this
  2. Hm, I currently do not have any code to share on that, but I can create one. Give me a few days and I will create a demo app
  3. Well, if we put React JS in here there really is not much Angular left :-) React JS is also quite large, 130 kb, add angular on top of that which is another 130 kb. But please discuss this further if you want. This is more of a principle to me, might be lots of scenarios I am not thinking of :-)

from flux-angular.

WolfSoko avatar WolfSoko commented on August 23, 2024

To learn about flux I played around with colors. I think it's a little bit more complex than the todo list.
Colorflux: http://embed.plnkr.co/dZhigG/preview
I learned a lot and of cause it's not perfect. As always there is much room for improvements and discussions. Looking forward for your opinion... Have fun!

from flux-angular.

jolafrite avatar jolafrite commented on August 23, 2024

@SuperheroicCoding Thanks for your code, I will definitely have a look
@christianalfoni Maybe integrate ReactJs is not the best thing to do.
From this library I was interested by the virtual dom part.
So when you have a long list with a lot of watchers, how do you handle that ?

from flux-angular.

christianalfoni avatar christianalfoni commented on August 23, 2024

Hi @jolafrite ,

Virtual DOM is awesome! But the Angular team has done a pretty good job with Angular too. They will probably switch to a virtual DOM for next release :-)

You mean if you have like 100 items and 5 different controllers is grabbing that on each change? Technically flux-angular will deep clone the list of 100 items 5 times. That is of course not very performant, but remember that you use exports to grab that list. You rarely want to grab all 100 items 5 different places. Maybe you only grab one of them, 10 first etc. That way it is quite performant.

The alternative is using immutability. I am looking into it, but there are some challenges. Like with immutable-js it is a lot more performant to do the current cloning that e.g. immutable.fromJS(items);. What you really want to achieve is just returning the list in an immutable wrapper, but then you can not use it directly in a template.

A different approach is to only change the reference of objects and arrays in the trees if they update. That will avoid the two way databinding from triggering and making sure you will have to specifically grab that new state form the store. The problem though is that the new list will be shared by all controllers fetching it. If they were to mutate the list the two-way-databinding would trigger and cause unexpected behavior.

The plan is to try it out. Create an immutable API for the store. Something like:

store.('MyStore', function () {
  return {
    items: [{label: 'foo'}, {label: 'bar'}],
    addItem: function () {
      this.push('items', {label: 'banana'});
    }
  };
})

Running that code will of course push the new object into the array, but it will also change the array reference on items by doing e.g. a items = items.slice(0). Whats nice about this is that it can also automatically trigger an event based on the first argument. So a push to "items" will trigger an "items" event. Kinda nice. What is a bit unclear now is if Angular does any mutations to the arrays/objects, which I think it does. There is this crazy $$hash property that seems to be added. This would then be shared across all controllers that have grabbed the array/object. And that sucks :-)

So I thought I would just implement this as a BETA API on top of the current API and let people try it out with caution. If it works it will be a hell of a lot faster than the cloning :-)

from flux-angular.

jolafrite avatar jolafrite commented on August 23, 2024

Cool I will give it a try.
I'm also quite impatient to see your demo app

from flux-angular.

christianalfoni avatar christianalfoni commented on August 23, 2024

Hi,

Just wanted to let you know that I have been working on a lib: https://github.com/christianalfoni/immutable-store and an article using that lib to use Angular in a pretty cool way. Will invite to a discussion as soon as the article is out :-)

It will also have the TODOMVC demo app included.

from flux-angular.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.