These are chat archives for canjs/canjs

3rd
Jul 2018
Jeroen Cornelissen
@jeroencornelissen
Jul 03 2018 06:26

@chasenlehara a unit-test failed because route.start()doesn’t get called inside the test. I fixed it like this:

updateRoute(newRoute) {
  route.data && route.data.assign && route.data.assign(newRoute);
}

The updateRoute fn gets called inside a setter of a more global state obj.

selectedItem: {
  set(newVal, resolve) {
    resolve(newVal);
    this.updateRoute({item: newVal.id});
  }
}
qantourisc
@qantourisc
Jul 03 2018 10:03
What do I need to do again to make sure a value I read in a can.stache.registerHelper gets triggered when the value is updated ?
This message was deleted
qantourisc
@qantourisc
Jul 03 2018 10:15
Found it -> make sure it's referenced in the can.stache(
Ngaosathe
@ThekhoN
Jul 03 2018 11:09
Where can i find a good comparison between CanJS vs ReactJS?
qantourisc
@qantourisc
Jul 03 2018 11:11
https://jsbin.com/suxonuf/3/edit?html,css,output <= in this example why doesn't console.log(can.route.link("test",{filter:"test"})) return <a href="/test">test</a> ?
I'd personally say: want to display some javascript data -> react
Want an application -> Canjs
Ngaosathe
@ThekhoN
Jul 03 2018 11:15
Thanks @qantourisc
qantourisc
@qantourisc
Jul 03 2018 11:16
But you can also use canjs for displaying data
@ThekhoN
Julian
@pYr0x
Jul 03 2018 13:27
:point_up: 28. Juni 2018 04:47 @justinbmeyer you said, i should setting of a select in a different way... which way do you prefer?
qantourisc
@qantourisc
Jul 03 2018 13:58
model.listData now return a list that auto-updates instead of a promise ?
Kevin Phillips
@phillipskevin
Jul 03 2018 15:03
@pYr0x you should use the new valueproperty definition
select: {
  value({ resolve, listenTo, lastSet }) {
    // when `select` is set, resolve with the new value
    listenTo(lastSet, resolve);

    // when `dataPromise` is set, reset to "all"
    listenTo("dataPromise", () => {
        resolve("all");
    });

    // resolve with the default value
    resolve("all");
  }
}
that way select is all defined in one place
@qantourisc getList returns a Promise when using can-connectif that's what you're asking about
Julian
@pYr0x
Jul 03 2018 15:28
@phillipskevin i thought, justin said, that we can't listen to promises with listenTo when they get resolved
Kevin Phillips
@phillipskevin
Jul 03 2018 15:30
yeah, you're right
  dataPromise: {
    get: function () { // don't use resolve for the promise
      return Select.getList({candidate: this.apiEndpoint});
    }
  },
  data: {
    get: function (lastSet, resolve) {
      this.dataPromise.then(resolve):
    }
  }
then you can listenTo("data", () => {})
data is set with resolve when the promise resolves
so you can listen to data
Julian
@pYr0x
Jul 03 2018 15:35
thank... i will check that later if i am at home
is that comment from you // don't use resolve for the promise?
qantourisc
@qantourisc
Jul 03 2018 15:37
@phillipskevin It's because I am user supermap I think, which has realtime on it, I might be wrong ?
Kevin Phillips
@phillipskevin
Jul 03 2018 15:38
what might be because of supermap? I'm not exactly sure what issue your'e seeing
@pYr0x yeah, that comment was from me
Julian
@pYr0x
Jul 03 2018 15:38
can you explain why?
Kevin Phillips
@phillipskevin
Jul 03 2018 15:38
and from Justin's question
Why are you using the resolve based getter but not using resolve?
in your code example you have get: function( lastSet, resolve )
but you were never calling resolve
Julian
@pYr0x
Jul 03 2018 15:38
yes
Kevin Phillips
@phillipskevin
Jul 03 2018 15:39
since you are returning the promise
so I just removed those parameters
Julian
@pYr0x
Jul 03 2018 15:39
what would happen if i used resolve Select.getList({candidate: this.apiEndpoint}).then(resolve)
Kevin Phillips
@phillipskevin
Jul 03 2018 15:39
then the value for that property would be the data, not the promise
Julian
@pYr0x
Jul 03 2018 15:40
got it :)
Kevin Phillips
@phillipskevin
Jul 03 2018 15:40
  data: {
    get: function (lastSet, resolve) {
      this.dataPromise.then(resolve):
    }
  }
that's why this one in my example does not return
just calls resolve
Julian
@pYr0x
Jul 03 2018 15:41
is that a common pattern to use dataPromise in a stache file with isResolved and the data for to have the real data
Kevin Phillips
@phillipskevin
Jul 03 2018 15:42
yes, exactly
Julian
@pYr0x
Jul 03 2018 15:42
are there other patterns or is that your perferd one
Kevin Phillips
@phillipskevin
Jul 03 2018 15:42
this is how I do it
Julian
@pYr0x
Jul 03 2018 15:42
ok
qantourisc
@qantourisc
Jul 03 2018 15:43
Not sure how to make a testcase. Roughly: SuperMap({ Map:objDef, List:objDefList, name:"objDef", url:{ getListData: function-that-returns-a-promise-with-result-data{ [] } }). If I then call Entity.getList().then( function(a){console.log(a)}); Then I have gotten empty lists, that later complete. iirc
Kevin Phillips
@phillipskevin
Jul 03 2018 15:44
yeah, so that is the behavior of the fall-through-cache
you initially get the cached data
then later, the instances are updated with the data from the server
so if you cache has an empty list that could happen
qantourisc
@qantourisc
Jul 03 2018 15:44
yea, but at that time the promise is "resolved" :D
Kevin Phillips
@phillipskevin
Jul 03 2018 15:44
yes
qantourisc
@qantourisc
Jul 03 2018 15:45
so the user gets an empty screen :p
Kevin Phillips
@phillipskevin
Jul 03 2018 15:45
well, why does the cache have an empty result?
ideally, the user will see a full screen
right away
qantourisc
@qantourisc
Jul 03 2018 15:45
I'll do some more testing, as soon as I get the data on the screen instead of on a console :/
Kevin Phillips
@phillipskevin
Jul 03 2018 15:46
and then the data will be updated automatically when the server responds with the latest data
@pYr0x one other pattern is to not have the second property and just use dataPromise.value in the template
qantourisc
@qantourisc
Jul 03 2018 15:47
@phillipskevin what would be the correct way to put data in the observed list ? .then( function(d){ component-view.replace(d) } or component-view.replace( promise) ?
Kevin Phillips
@phillipskevin
Jul 03 2018 15:47
but since you need to use the value in other places in your viewModel, that won't work for you
@qantourisc I probably need a bigger example to answer that
can you post on the forum? https://forums.donejs.com/
qantourisc
@qantourisc
Jul 03 2018 15:50
Unlikely :/ I used to do this https://v2.canjs.com/guides/LoadingStates.html in v2
now with v4, not sure
qantourisc
@qantourisc
Jul 03 2018 16:24
weird, as soon as it comes out of cache it breaks :p
I'll fix it later, I ran out of time for today, thank you in any case !
Kevin Phillips
@phillipskevin
Jul 03 2018 16:26
ok, good luck
qantourisc
@qantourisc
Jul 03 2018 20:51
Am I causing this ? it takes around 2 seconds to render a table/grid of 280 cells. And most of this time is spend in: Garabage collect and "Gecko".
qantourisc
@qantourisc
Jul 03 2018 20:58
Is there something lighter then can.Component: for example: to do for example: <td-field class="{{type}}" type:from="type" value:from="../{{key}}"/> I suppose a helper might lessen the load ?
Chasen Le Hara
@chasenlehara
Jul 03 2018 22:17
@qantourisc The most common thing I’ve seen is using partials to break up the logic for rows/cells.
Is that in Firefox? Is perf similar in Chrome/etc.?
qantourisc
@qantourisc
Jul 03 2018 22:40
they are quite simuliar in slowness in this case
qantourisc
@qantourisc
Jul 03 2018 23:03
registeredHelpers are about twice as fast.
I wonder if going into some sort of "stop binding for this section" would help / be possible.
helpers are probably equal to partials, but I need some code in there so it's helpers ;)
Chasen Le Hara
@chasenlehara
Jul 03 2018 23:05
Would “stop binding for this section” basically mean, render this once and don’t set up listeners for updates?
qantourisc
@qantourisc
Jul 03 2018 23:07
yep
qantourisc
@qantourisc
Jul 03 2018 23:13
implementing more of the function and using peek while I am at it, sped it up further
i mean do more of the original-stache template in javacode
And it's fast in chrome now
qantourisc
@qantourisc
Jul 03 2018 23:20
40 rows 600ms in chrome; and about 3seconds in firefox :p
Chasen Le Hara
@chasenlehara
Jul 03 2018 23:48
Is that with a dev or production build?