These are chat archives for mithriljs/mithril.js

26th
Oct 2015
suhaotian
@suhaotian
Oct 26 2015 05:38
how to organize mithril.js ...
how to organize mithril.js component ...
Niklas
@niklashultstrom
Oct 26 2015 06:24
@Bondifrench thanks!
Stephan Hoyer
@StephanHoyer
Oct 26 2015 07:54
@suhaotian Think it’s because React has much more marketing power than mithril. In JavaScript it’s like everywhere: The best things are not always the popular ones. Another reason is that the eco-system of react is now much larger and people with lesser experiance in JS have an easier entry point because there is so much learning material of react out there. I also belive that react is much more opinionated which is favoured by most developers.
And regarding github-stars react is only 6 times more popular than mithril
Barney Carroll
@barneycarroll
Oct 26 2015 08:00
I interpreted size as referring to byte-size :)
Stephan Hoyer
@StephanHoyer
Oct 26 2015 08:03
Ahhh…
Ok, that’s a question I’m also curious of :D
But this has to be answered by the react people I think
Hendrik Roth
@HendrikRoth
Oct 26 2015 11:02
is someone fimilar with msx? if i write: return <h1>Preview</h1> ... i receive a illegal return statement error
just putting <h1>Preview</h1> in the transformer it works.
but i would like to use "return" because i would like to define different vars in the view
Barney Carroll
@barneycarroll
Oct 26 2015 11:03
Sounds like a bug in MSX
Hendrik Roth
@HendrikRoth
Oct 26 2015 11:04
msx.transform('<h1>Test</h1>', {precompile: true}) vs msx.transform('return <h1>Test</h1>', {precompile: true})
@barneycarroll maybe i call it wrong?
Barney Carroll
@barneycarroll
Oct 26 2015 11:08
msx.transform converts MSX strings to compiled Mithril vDOM objects. What are you trying to do?
Hendrik Roth
@HendrikRoth
Oct 26 2015 11:08
@barneycarroll i would like to save mithril components in a database
with msx syntax
Barney Carroll
@barneycarroll
Oct 26 2015 11:09
return <h1>Test</h1> looks like a function body
Hendrik Roth
@HendrikRoth
Oct 26 2015 11:09
this would be my view
Barney Carroll
@barneycarroll
Oct 26 2015 11:11
Yeah, you can't MSX transform a return statement. You can MSX transform <h1>Test</h1> or you can MSX transform an entire Javascript file including MSX language, but you can't MSX compile random JS statements.
Hendrik Roth
@HendrikRoth
Oct 26 2015 11:11
hmm
Barney Carroll
@barneycarroll
Oct 26 2015 11:11
Besides, if you're transforming it there, you won't be saving MSX strings on the database, you'd be saving a compiled Mithril object.
The purpose of MSX is to make Mithril easier to write for people who prefer XML-like syntax to Javascript function invocations
Hendrik Roth
@HendrikRoth
Oct 26 2015 11:12
yes i know, i personally don't write msx..but our designers prefer it
Barney Carroll
@barneycarroll
Oct 26 2015 11:12
The result of msx.transform( '<h1>Test</h1>' ) will be the same as m( 'h1', 'Test' )
Hendrik Roth
@HendrikRoth
Oct 26 2015 11:12
and so i wanted to save the converted mithril obj to the db
Barney Carroll
@barneycarroll
Oct 26 2015 11:13
The output will be { tag : 'h1', attrs : {}, children : [ 'Test' ] }
That's an object
You can serialize it as JSON
Hendrik Roth
@HendrikRoth
Oct 26 2015 11:13
@barneycarroll i could also set precompile to false
Barney Carroll
@barneycarroll
Oct 26 2015 11:14
Why are you transforming it, if you want to save it as MSX?
Hendrik Roth
@HendrikRoth
Oct 26 2015 11:15
@barneycarroll it is kinda a template-system for me in this case. designers write msx and the result would be the mithril code to be used in the pages later
or i have to use plain msx in my view without the var definitions
Barney Carroll
@barneycarroll
Oct 26 2015 11:15
So I could understand saving a view function or a component, or a node
But a return statement, by itself? It doesn't really make any sense
Hendrik Roth
@HendrikRoth
Oct 26 2015 11:16
i would save the view function and a controller function
to load it later via m.component
Barney Carroll
@barneycarroll
Oct 26 2015 11:17
So the bigger picture is, you're righting a piece of Javascript that takes an MSX string provided by a designer, converts to Javascript, and saves it to a database?
Hendrik Roth
@HendrikRoth
Oct 26 2015 11:18
correct
Barney Carroll
@barneycarroll
Oct 26 2015 11:19
Sounds incredibly flaky, but I think you're just going to have to tell your designers not to throw in random Javascript statements. Any submission must be a function, a component or a piece of markup. Not some weird part of a function.
Hendrik Roth
@HendrikRoth
Oct 26 2015 11:19
so a plain msx view and a plain controller function
Barney Carroll
@barneycarroll
Oct 26 2015 11:19
Yeah, a component.
Hendrik Roth
@HendrikRoth
Oct 26 2015 11:19
would u save a complete component?
Barney Carroll
@barneycarroll
Oct 26 2015 11:20
I have saved numerous components over the past months.
I don't know the reason your designers want bits of Mithril in a database, but if you have dynamic bits of Mithril I would suggest saving them as components
Hendrik Roth
@HendrikRoth
Oct 26 2015 11:21
@barneycarroll if i send var comp = { controller() {}, view: (scope) { return '<h1>Test</h1>' }} and put it in msx.transform it would work?
i don't think so, or?
@barneycarroll i don't know any other method to save it to the db as using msx.transform?
Hendrik Roth
@HendrikRoth
Oct 26 2015 11:27
i don't want to use the msx transformer on the client side for the resulting pages
like here
Hendrik Roth
@HendrikRoth
Oct 26 2015 11:38
@barneycarroll ah i forgot to give msx "m.component"
Barney Carroll
@barneycarroll
Oct 26 2015 11:47
Fair enough
I wrote a little MSX playground to help validate MSX snippets
Andrea Coiutti
@ACXgit
Oct 26 2015 11:55
how is it possible to use the onunload function in a component when no return is set inside the controller?
Barney Carroll
@barneycarroll
Oct 26 2015 11:56
this.onunload
Andrea Coiutti
@ACXgit
Oct 26 2015 11:57
this.onunload = function() {
    console.log('Component unloaded');
}
like this?
Andrea Coiutti
@ACXgit
Oct 26 2015 12:02
works, I got fooled because I was using it in a sub component instead of in the parent one
Arthur Clemens
@ArthurClemens
Oct 26 2015 12:02
how do you call it?
Andrea Coiutti
@ACXgit
Oct 26 2015 12:05
my main structure is this:
var Layout = function(component) {
    return {
        controller: function() {
            //manage components manually, so that rendering takes a single pass (thus preventing UI flickering)
            this.component = new (component.controller || function() {});
            this.topBar = new TopBar.controller();
            this.bottomBar = new BottomBar.controller();
            this.sideBar = new SideBar.controller();
            this.TrackInfo = new TrackInfo.controller();
            this.onunload = function() {
                window.onscroll = null;
            }
        },
        view: function(ctrl) {
            return [
                m('#main', [
                    component.view(ctrl.component)
                ]),
                TopBar.view(ctrl.topBar),
                BottomBar.view(ctrl.bottomBar),
                SideBar.view(ctrl.sideBar),
                m('#sidebar-overlay', {className: SideBar.vm.open ? 'opened' : '', onclick: function() {SideBar.close(); BottomBar.vm.showVolumeBar = false;}}),
                TrackInfo.view(ctrl.TrackInfo)
            ];
        }
    };
};
and then
m.route(document.body, '/', {
        '/': Layout(Playback),
        '/queue/': Layout(Queue),
        ...
    });
Barney Carroll
@barneycarroll
Oct 26 2015 12:07
Ah
Cool
Andrea Coiutti
@ACXgit
Oct 26 2015 12:08
Leo's tip :D
Barney Carroll
@barneycarroll
Oct 26 2015 12:09
How did you encounter flickering with view-initialised components?
That's new to me
Andrea Coiutti
@ACXgit
Oct 26 2015 12:12
I have some elements in the UI which are always visible across the different pages
like topbar, bottombar, etc
they were redrawn at every route change
thus the flickering effect
Barney Carroll
@barneycarroll
Oct 26 2015 12:13
Initialising sub-controllers in the controller won't stop that
Andrea Coiutti
@ACXgit
Oct 26 2015 12:14
now I don't have that effect anymore
Barney Carroll
@barneycarroll
Oct 26 2015 12:14
What you want is m.redraw.strategy( 'diff' ) in the Layout controller
On route change, Mithril trashes the whole DOM and re-generates it from scratch by default - explicitly setting diff means it will only change the nodes that differ from the previous route
Andrea Coiutti
@ACXgit
Oct 26 2015 12:15
I don't remember if we tried that before using this
@ACXgit ^
Andrea Coiutti
@ACXgit
Oct 26 2015 12:56
what are you trying to show?
Barney Carroll
@barneycarroll
Oct 26 2015 12:56
I wrote a little bin to show you how many DOM mutations occur
So this component is very very simple
Andrea Coiutti
@ACXgit
Oct 26 2015 12:57
the efficiency of the different strategies?
Barney Carroll
@barneycarroll
Oct 26 2015 12:57
Yup
If you set it to all, then change route, you can see a huge number of DOM mutations
You can't see a flicker on this scale, because the component is still really simple. But for any significant app, imagine rebuilding almost exactly the same DOM, from scratch
Andrea Coiutti
@ACXgit
Oct 26 2015 12:58
I see the DOM mutations number changing only when I switch strategy, not the route
I have some errors in console:
ReferenceError: alert is not defined
http://null.jsbin.com/runner
Line 26
Barney Carroll
@barneycarroll
Oct 26 2015 12:58
Weird
alert is a native
OK, removed the onunload alert
If you set strategy to diff, then change route, you can see it only makes a couple of changes - just changing the title
Andrea Coiutti
@ACXgit
Oct 26 2015 13:00
I still get the error
Barney Carroll
@barneycarroll
Oct 26 2015 13:00
Bizarre. There is no alert in the code any more.
Andrea Coiutti
@ACXgit
Oct 26 2015 13:00
ok I tried that in Chrome
and I got the point
there is a huge difference indeed
so when is wise to use the "diff" strategy?
Barney Carroll
@barneycarroll
Oct 26 2015 13:03
The only 'problem' with 'diff' for route change is that subcomponents won't unload
In your Layout controller
I put it as the first line of every route component controller
Route change is the only time Mithril tries to do all by default
Apart from that, it's diff by default anyway
Andrea Coiutti
@ACXgit
Oct 26 2015 13:08
whoa
you just helped me to fix the last flickering issue I had :D
Barney Carroll
@barneycarroll
Oct 26 2015 13:09
Awesome!
I had an app with insta-search (like google) where every time the user typed, the URL changed - so performing diff redraws on route change was essential to stop the application grinding to a halt
Andrea Coiutti
@ACXgit
Oct 26 2015 13:10
now my main component is like this:
var Layout = function(component) {
    return {
        controller: function() {
            // Manage components manually, so that rendering takes a single pass (thus preventing UI flickering)
            this.component = new (component.controller || function() {});
            this.topBar = new TopBar.controller();
            this.bottomBar = new BottomBar.controller();
            this.sideBar = new SideBar.controller();
            this.TrackInfo = new TrackInfo.controller();
            this.onunload = function() {
                window.onscroll = null;
            };
        },
        view: function(ctrl) {
            console.log(m.redraw.strategy());
            m.redraw.strategy('diff');
            return [
                m('#main', [
                    component.view(ctrl.component)
                ]),
                TopBar.view(ctrl.topBar),
                BottomBar.view(ctrl.bottomBar),
                SideBar.view(ctrl.sideBar),
                m('#sidebar-overlay', {className: SideBar.vm.open ? 'opened' : '', onclick: function() {SideBar.close(); BottomBar.vm.showVolumeBar = false;}}),
                TrackInfo.view(ctrl.TrackInfo)
            ];
        }
    };
};
I added the strategy change at the beginning of the view
Barney Carroll
@barneycarroll
Oct 26 2015 13:11
You don't really need to do that, since it will be diff by default. The only time you need to set it is in the controller, which executes on route change
Andrea Coiutti
@ACXgit
Oct 26 2015 13:11
is that the best place? I see the console.log at every redraw...
Barney Carroll
@barneycarroll
Oct 26 2015 13:11
Yes, views execute every redraw
var Layout = function(component) {
    return {
        controller: function() {
            m.redraw.strategy('diff');
            // Manage components manually, so that rendering takes a single pass (thus preventing UI flickering)
            this.component = new (component.controller || function() {});
            this.topBar = new TopBar.controller();
            this.bottomBar = new BottomBar.controller();
            this.sideBar = new SideBar.controller();
            this.TrackInfo = new TrackInfo.controller();
            this.onunload = function() {
                window.onscroll = null;
            };
        },
        view: function(ctrl) {
            return [
                m('#main', [
                    component.view(ctrl.component)
                ]),
                TopBar.view(ctrl.topBar),
                BottomBar.view(ctrl.bottomBar),
                SideBar.view(ctrl.sideBar),
                m('#sidebar-overlay', {className: SideBar.vm.open ? 'opened' : '', onclick: function() {SideBar.close(); BottomBar.vm.showVolumeBar = false;}}),
                TrackInfo.view(ctrl.TrackInfo)
            ];
        }
    };
};
Andrea Coiutti
@ACXgit
Oct 26 2015 13:13
great
I got fooled by the console.log before it, which correctly outputs "all" before the change
adios flickering!
Barney Carroll
@barneycarroll
Oct 26 2015 13:13
Ah
Andrea Coiutti
@ACXgit
Oct 26 2015 13:14
this is great. Thank you very much for the tip @barneycarroll !
Barney Carroll
@barneycarroll
Oct 26 2015 13:14
No worries :)
Andrea Coiutti
@ACXgit
Oct 26 2015 13:15
thank you in advance also from the future thousands of users of the UI :)
Hendrik Roth
@HendrikRoth
Oct 26 2015 13:45
@barneycarroll hmm my problem is... that i have to use eval to show the components... and if i have a syntax err in it, i don't get it catched
Barney Carroll
@barneycarroll
Oct 26 2015 13:48
Ah
Hendrik Roth
@HendrikRoth
Oct 26 2015 13:48
:-/
Barney Carroll
@barneycarroll
Oct 26 2015 13:50
In a normal development workflow, you'd have source code written in MSX and transform the result on build
Hendrik Roth
@HendrikRoth
Oct 26 2015 13:50
@barneycarroll yes but in my case this is not possible
Barney Carroll
@barneycarroll
Oct 26 2015 13:50
Can you explain your case in more detail?
Hendrik Roth
@HendrikRoth
Oct 26 2015 13:51
@barneycarroll something similar to codepen etc.. for mithril... so you can create a component on the fly with the result shown in the browser
Barney Carroll
@barneycarroll
Oct 26 2015 13:54
I still reckon you should save the source file and have a build step as part of the process
Hendrik Roth
@HendrikRoth
Oct 26 2015 13:56
is not possible.
Barney Carroll
@barneycarroll
Oct 26 2015 13:56
Why not?
This is basically what jsbin does
Hendrik Roth
@HendrikRoth
Oct 26 2015 13:58
@barneycarroll you mean it saves the code to a js file ... and than requires them with for example requirejs?
Barney Carroll
@barneycarroll
Oct 26 2015 13:59
No, it saves user input — so people can still see the original source and modify it if needs be, but the output is saved too
Hendrik Roth
@HendrikRoth
Oct 26 2015 13:59
@barneycarroll i do this also
@barneycarroll but how do they display the code inputted?
(transformed code)
Barney Carroll
@barneycarroll
Oct 26 2015 14:07
Right, the problem is that you can't transform incomplete segments of MSX
Hendrik Roth
@HendrikRoth
Oct 26 2015 14:08
no i see the problem now i think. at jsbin the sandbox the eval function
Barney Carroll
@barneycarroll
Oct 26 2015 14:09
Unless you want to write your own parser, you're going to have to deal with stuff that can be parsed by the JSX API
Hendrik Roth
@HendrikRoth
Oct 26 2015 14:18
@barneycarroll http://jsbin.com/yikutotoge/edit?js,output but this simple example isn't doing it either..mhm
ok this works: http://jsbin.com/yikutotoge/edit?js,output ... but here is not my mentioned problem, because they sandbox the eval function internallu
Nicholas Antonov
@NicholasAntonov
Oct 26 2015 16:41
I'm using mithril with refluxjs, and I'm having a problem that whenever an action causes a store to update, mithril doesn't redraw, and will only redraw on the second dispatching of an action
right now each of my controllers just returns the reflux store, and all the state that gets updated is in the store.
If I call m.redraw() at the end of each method that modifies state, everything works fine, but this obviously shouldn't be required
Barney Carroll
@barneycarroll
Oct 26 2015 16:45
Yeah it should
Mithril needs to be told when to redraw
Arthur Clemens
@ArthurClemens
Oct 26 2015 16:47
I don’t know reflux, but Mithril only redraws on route change and with events.
Barney Carroll
@barneycarroll
Oct 26 2015 16:50
^ and when m.requests resolve. But m.redraw() is not a hack and there is nothing wrong with using it — it is the correct API for telling Mithril you want to update the view.
Nicholas Antonov
@NicholasAntonov
Oct 26 2015 16:52
but then why does it work after 2 actions?
It looks like I was incorrect on how I thought m.prop worked, Note that modifying the values of m.prop getter-setters does not trigger redrawing.. That seems like an odd design choice
I wish there was a way to force m.prop modifications to cause a redraw
Nicholas Antonov
@NicholasAntonov
Oct 26 2015 16:57
Thats the entire purpose of knockout observables. Without that feature m.prop is barely useful aside from making some syntax nicer
Grant Miner
@llambda
Oct 26 2015 17:00
In general its better to redraw only when necessary, to avoid slowdowns
Nicholas Antonov
@NicholasAntonov
Oct 26 2015 17:01
but In all but edge cases, updating m.prop would probably mean that something in your component needs to be redrawn
Barney Carroll
@barneycarroll
Oct 26 2015 17:03
Mithril isn't built around observables. As @ArthurClemens says, in idiomatic Mithril, automatic redraws occur 1) on route change 2) on XHR resolution 3) on DOM event resolution
If you are introducing new APIs that change the data and want a redraw, then you need to tell Mithril to do that. You can easily hook m.redraw() into an observable's change callback.
You could of course monkey patch m.prop.
Caner Uguz
@caneruguz
Oct 26 2015 17:08
I'm having some issues implementing a deeply nested component structure and it might be due to a limited understanding of what mithril does. Is it correct to say that controller function runs at initialization and not again but view function runs at every redraw or variable change?
Barney Carroll
@barneycarroll
Oct 26 2015 17:08
@NicholasAntonov
m.prop = function( value ){
    return function( input ){
        if( arguments.length ){
            value = input

            m.redraw()
        }

        return value
    }
}
@caneruguz Yes, that's right
Caner Uguz
@caneruguz
Oct 26 2015 17:09
I have a library that needs to display data as a subcomponent and parent component needs to reload with new data. I can do this by using m.mount each time but it seems like there might be a better way.
Nicholas Antonov
@NicholasAntonov
Oct 26 2015 17:10
Alright, thanks!
I would love to hear @lhorie 's input on this or the reasoning behind this decision though.
Caner Uguz
@caneruguz
Oct 26 2015 17:11
essentially if I have this m.component(myLib, {data : dataProp }) and I want it to reinitialize when dataProp m.prop changes I have to put some logic into myLib.view but then it will reinitialize with the data passes at every redraw.
So something like this
var myLib = {
    controller : function(){
        var self = this;
        self.counter = 0;
        this.processData = function(value){
            self.counter++;
            return self.counter + ': ' + value;
        };
    },
    view : function(ctrl, args){
        var data = ctrl.processData(data());
        return m('', data);
    }
};
Just as an example. In this case though I would need to somehow check if data in args is different so I don't reprocess it.
Barney Carroll
@barneycarroll
Oct 26 2015 17:16
@caneruguz you can set the initialisation logic as a controller method to expose it to the view:
var myComponent = {
    controller : function(){
        this.init = function(){
            // initialisation logic
            this.count = 0
        }.bind( this )

        this.init()
    },

    view : function( ctrl ){
        return m( 'div',
            m( 'p', 'Count: ' + ctrl.count ),

            m( 'button', {
                onclick : function(){
                    ctrl.count++
                }
            }, 'Increment' ),

            m( 'button', {
                onclick : ctrl.init
            }, 'Reload' )
        )
    }
}
Caner Uguz
@caneruguz
Oct 26 2015 17:18
In this case though the new data is coming from within the component, I have a parent component sending in new data
My example was pretty bad, I'll see if I can make something better
Barney Carroll
@barneycarroll
Oct 26 2015 17:19
You can redraw at any time by calling m.redraw(), and the view will update any parts that have changed
Barney Carroll
@barneycarroll
Oct 26 2015 17:24
The idiomatic Mithril view should be declarative — Mithril will execute all the views on each redraw and then make sure to modify only the parts of the DOM that have changed since last time
Caner Uguz
@caneruguz
Oct 26 2015 17:28
Not so much better but hopefully a better abstract example:
var myLib = {
    controller : function(){
        var self = this;
        this.processData = function(value){
            return  'User name is: ' + value;
        };
    },
    view : function(ctrl, args){
        var data = ctrl.processData(data());
        return m('div', data);
    }
};

var parentComponent = {
    controller : function(args){
        this.name = m.prop('Jane');
        this.load2 = function () {
            this.name('John');
        };
    },
    view : function (ctrl, args) {
        return m('#users',
            m.component(myLib, { data : ctrl.name }),
            m('button', {onclick : ctrl.load2}, 'Load Another User ' )
        );
    }
};
In this exaple myLib.view runs very often, at every redraw, I could put the processData into the view return but there are intermediate steps the data needs to take.
I guess an easier question to answer, what's the downside of calling m.mount(...) every time the data changes, which will be controller by user click.
Grant Miner
@llambda
Oct 26 2015 17:31
dont forget controller also receives 'args'
Caner Uguz
@caneruguz
Oct 26 2015 17:35
@llambda yes, but it gets initialized once so it won't be aware of the change in args. Is that right?
Barney Carroll
@barneycarroll
Oct 26 2015 17:35
@caneruguz that's right
It's generally a bad idea to put data processing logic in components.
Caner Uguz
@caneruguz
Oct 26 2015 17:37
Yes I agree with that but what if we have a library that is a mithril component?
Barney Carroll
@barneycarroll
Oct 26 2015 17:37
If the data you're receiving from the server needs to be transformed to make sense for your app, you should do that after you receive it from the server
What about this library component?
Caner Uguz
@caneruguz
Oct 26 2015 17:38
yes, maybe I can look into my architecture again but the value of the library is to flatten and structure the data for virtual scrolling large data sets and the data is hierarchical.
So if I got a full flat list into the component that would be fine but it has folders that get new data injected in with lazyloading.
I think I might be coming across the limitations of my own plugin architecture
Barney Carroll
@barneycarroll
Oct 26 2015 17:39
Transforming large data sets can be quite tricky, but it's even trickier if you're doing it in views ;)
Caner Uguz
@caneruguz
Oct 26 2015 17:39
That's true
Barney Carroll
@barneycarroll
Oct 26 2015 17:39
Aha
Caner Uguz
@caneruguz
Oct 26 2015 17:39
In the meantime though, can I remount the component?
As a short term solution while I refactor a whole bunch of code?
Barney Carroll
@barneycarroll
Oct 26 2015 17:40
It's possible to flatten a data structure without losing the references.
Rodrigo Álvarez
@Papipo
Oct 26 2015 17:40
I need some data in my view that comes from localstorage, given that its API is async, how I am supposed to get that data when redrawing?
Barney Carroll
@barneycarroll
Oct 26 2015 17:41
@caneruguz m.mount will reload a top level component, but will not necessarily reinitialize nested components
Try that this.init trick I showed you
As a quick hack, you could invoke it on every draw
While you figure out how to remodel your data
Caner Uguz
@caneruguz
Oct 26 2015 17:43
okay cool I'll give it a shot, thanks for the help @barneycarroll !
Barney Carroll
@barneycarroll
Oct 26 2015 17:43
@Papipo localStorage isn't async
Rodrigo Álvarez
@Papipo
Oct 26 2015 17:44
well
I am using localforage actually
which is
:D
I had this code on my controller which passed some values downstream, but on redraw that doesn't work because the controller won't run again
And the storage should be the single source of truth. Modifying some sort of viewModel seems wrong
Barney Carroll
@barneycarroll
Oct 26 2015 17:46
I would do the same thing as with m.request
Access your async storage in the controller and on resolution, assign the results to an object accessible to the view, then trigger a redraw
Rodrigo Álvarez
@Papipo
Oct 26 2015 17:48
and what happens when the value changes
Barney Carroll
@barneycarroll
Oct 26 2015 17:48
Trigger redraw again?
Rodrigo Álvarez
@Papipo
Oct 26 2015 17:48
but the value would be cached on that object
Barney Carroll
@barneycarroll
Oct 26 2015 17:52
Treat this storage as if it were AJAX
Because it's async, your local model can only ever get snapshots of it, which could be out of synch at any time
You could write an m.request like function around it that starts computation when a request is made and ends computation on resolution
Rodrigo Álvarez
@Papipo
Oct 26 2015 17:56
ok, thanks, gonna try to do something like that
Barney Carroll
@barneycarroll
Oct 26 2015 17:56
As with remote data, you need to figure out how and when you're going to request updates, and make sure the data is passed through
But as for local references going stale, you just need to make sure that any new update is assigned to the same references and trigger a redraw
There's no danger of creating little islands of out-of-sync data that aren't conceptually identical to the problems of persisting data with the server
Just go through the guide and mentally substitute 'local storage' for 'HTTP' :)
Rodrigo Álvarez
@Papipo
Oct 26 2015 17:59
;D
Rodrigo Álvarez
@Papipo
Oct 26 2015 20:47
What's wrong with this? callbacks[name] && callbacks[name](args);
JSLint complains
Barney Carroll
@barneycarroll
Oct 26 2015 20:49
Jslint is awful
Rodrigo Álvarez
@Papipo
Oct 26 2015 20:49
:D
any other recommendation?
Grant Miner
@llambda
Oct 26 2015 21:16
JSHint