These are chat archives for canjs/canjs

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

@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 UTC
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 UTC
Found it -> make sure it's referenced in the can.stache(
Ngaosathe
@ThekhoN
Jul 03 2018 11:09 UTC
Where can i find a good comparison between CanJS vs ReactJS?
qantourisc
@qantourisc
Jul 03 2018 11:11 UTC
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 UTC
Thanks @qantourisc
qantourisc
@qantourisc
Jul 03 2018 11:16 UTC
But you can also use canjs for displaying data
@ThekhoN
Julian
@pYr0x
Jul 03 2018 13:27 UTC
: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 UTC
model.listData now return a list that auto-updates instead of a promise ?
Kevin Phillips
@phillipskevin
Jul 03 2018 15:03 UTC
@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 UTC
@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 UTC
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 UTC
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 UTC
@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 UTC
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 UTC
can you explain why?
Kevin Phillips
@phillipskevin
Jul 03 2018 15:38 UTC
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 UTC
yes
Kevin Phillips
@phillipskevin
Jul 03 2018 15:39 UTC
since you are returning the promise
so I just removed those parameters
Julian
@pYr0x
Jul 03 2018 15:39 UTC
what would happen if i used resolve Select.getList({candidate: this.apiEndpoint}).then(resolve)
Kevin Phillips
@phillipskevin
Jul 03 2018 15:39 UTC
then the value for that property would be the data, not the promise
Julian
@pYr0x
Jul 03 2018 15:40 UTC
got it :)
Kevin Phillips
@phillipskevin
Jul 03 2018 15:40 UTC
  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 UTC
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 UTC
yes, exactly
Julian
@pYr0x
Jul 03 2018 15:42 UTC
are there other patterns or is that your perferd one
Kevin Phillips
@phillipskevin
Jul 03 2018 15:42 UTC
this is how I do it
Julian
@pYr0x
Jul 03 2018 15:42 UTC
ok
qantourisc
@qantourisc
Jul 03 2018 15:43 UTC
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 UTC
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 UTC
yea, but at that time the promise is "resolved" :D
Kevin Phillips
@phillipskevin
Jul 03 2018 15:44 UTC
yes
qantourisc
@qantourisc
Jul 03 2018 15:45 UTC
so the user gets an empty screen :p
Kevin Phillips
@phillipskevin
Jul 03 2018 15:45 UTC
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 UTC
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 UTC
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 UTC
@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 UTC
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 UTC
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 UTC
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 UTC
ok, good luck
qantourisc
@qantourisc
Jul 03 2018 20:51 UTC
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 UTC
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 UTC
@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 UTC
they are quite simuliar in slowness in this case
qantourisc
@qantourisc
Jul 03 2018 23:03 UTC
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 UTC
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 UTC
yep
qantourisc
@qantourisc
Jul 03 2018 23:13 UTC
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 UTC
40 rows 600ms in chrome; and about 3seconds in firefox :p
Chasen Le Hara
@chasenlehara
Jul 03 2018 23:48 UTC
Is that with a dev or production build?