These are chat archives for ractivejs/ractive

6th
Feb 2018
Juan C. Andreu
@andreujuanc
Feb 06 2018 11:44
I cant wait for this :3 ractivejs/ractive#3120
Paul Maly
@PaulMaly_twitter
Feb 06 2018 13:27
How about attributes validation in Ractive?
Chris Reeves
@evs-chris
Feb 06 2018 13:38
Ractive has optional/required attribute checking that is used for warning about missing attributes and collecting extra attributes into a partial that can be used in the components template
Paul Maly
@PaulMaly_twitter
Feb 06 2018 13:39
I know, but it’s not the same
Chris Reeves
@evs-chris
Feb 06 2018 13:39
Type validation, etc are left to the component author to handle in init.
Paul Maly
@PaulMaly_twitter
Feb 06 2018 13:41
So, you don’t think that it’s common case to include it to Ractive?
Joseph
@fskreuz
Feb 06 2018 14:29
Value types is something that's ideally dealt with at authoring time either by the language, tool or IDE. This should never be done at runtime, it's just extra cycles and code.
Joseph
@fskreuz
Feb 06 2018 14:36
No matter how correct or clever your code is, bad data will always cause an app to blow up. Fix the root of the problem, fix the bad data.
Paul Maly
@PaulMaly_twitter
Feb 06 2018 14:52
I think simple warnings could be very helpful to detect where is the problem in the bad data.
Btw, in most cases will be enough only type checking.
kouts
@kouts
Feb 06 2018 14:56
You can do this onconfig or create a wrapper for your Ractive instances and have a preprocess method there, that is how I handle these situations.
Paul Maly
@PaulMaly_twitter
Feb 06 2018 14:57
Seems, we don’t even need to implement any new api for that. Simple solution could be - if we’ve default value of an attribute, we able to compare incoming value type with default value type and throw a warning if not match
kouts
@kouts
Feb 06 2018 14:57
what about nested values?
Paul Maly
@PaulMaly_twitter
Feb 06 2018 14:57
If default value unspecified, so skip this step
kouts
@kouts
Feb 06 2018 14:57
inside object or arrays?
Paul Maly
@PaulMaly_twitter
Feb 06 2018 14:58
I talk about attributes only
There is no nested values
kouts
@kouts
Feb 06 2018 14:58
can't attributes be arrays or objects?
Paul Maly
@PaulMaly_twitter
Feb 06 2018 14:59
Can be, be it’s the value of attribute itself.
*but
I mean (mobile, sorry):
attributes: { required: [‘foo’, ‘bar’, ‘baz’]}
data: { foo: false, bar: {}}
kouts
@kouts
Feb 06 2018 15:03
Ahh now I see you want something like Vue
but Vue handles things a little differently
Paul Maly
@PaulMaly_twitter
Feb 06 2018 15:04
So, foo and bar will be simple checked to type
kouts
@kouts
Feb 06 2018 15:04
Ractive does not separate attributes and data like Vue does
Paul Maly
@PaulMaly_twitter
Feb 06 2018 15:04
baz type checking will be ignored
kouts
@kouts
Feb 06 2018 15:04
so I think this would be an extra overhead not worth it IMHO
Paul Maly
@PaulMaly_twitter
Feb 06 2018 15:05
``<child foo=“fhjjfg” bar=“false”/>
Omg, mobile typing is killing me
Paul Maly
@PaulMaly_twitter
Feb 06 2018 15:18
Not so big overhead, just ‘typeof’ in circle. I believe it’s very common case to left it to the component level
Juan C. Andreu
@andreujuanc
Feb 06 2018 18:19
Maybe optional by extending Ractive using the new proposed "use" method C:
Not everyone is authoring components
Joseph
@fskreuz
Feb 06 2018 18:28
More like "not everyone is using 200% of Ractive", thus it makes no sense adding a ton of stuff to the core.
Arnaud Dagnelies
@dagnelies
Feb 06 2018 18:28
Joseph
@fskreuz
Feb 06 2018 18:29
:tada:
Arnaud Dagnelies
@dagnelies
Feb 06 2018 18:29
in number 3, you'll get to click on it and open a modal to see the details
Joseph
@fskreuz
Feb 06 2018 18:29
I'm so behind on movies. This makes it easier to check. :D
Arnaud Dagnelies
@dagnelies
Feb 06 2018 18:29
in number 4, I'll try to add logging in to add comments, but that one will probably be a bit more tricky ...it takes quite some time
yeah, it's also suprising what you can do with 100 lines of code
I think it's also quite nice as example since it fetches "real" data with a "real" API, and not just pseudo/fake data
bummer ...infinite scrolling doesn't seem to work within the iframe :/
Paul Maly
@PaulMaly_twitter
Feb 06 2018 18:33

in number 3, you'll get to click on it and open a modal to see the details

is it work ?

Arnaud Dagnelies
@dagnelies
Feb 06 2018 18:33
what?
Paul Maly
@PaulMaly_twitter
Feb 06 2018 18:34
 onclick="showDetails({{.id}})"
typo I think
Arnaud Dagnelies
@dagnelies
Feb 06 2018 18:35
it's not yet implemented
it's late, I'll do that another time
Arnaud Dagnelies
@dagnelies
Feb 06 2018 18:36
...and my boss would prefer I focus on other things than doing ractive examples, so I can't take too much time for it
Paul Maly
@PaulMaly_twitter
Feb 06 2018 18:36
:smile:
Arnaud Dagnelies
@dagnelies
Feb 06 2018 18:36
I know, it's there, but it's "work in progress"
there are also other files there which aren't ready
see ya
Paul Maly
@PaulMaly_twitter
Feb 06 2018 18:38
yep, I understand you. ))) I try to produce RealWorld demo app about two days, but still there
Amazing
compiling dotnet core to wasm and then runing razor in the browser
Chris Reeves
@evs-chris
Feb 06 2018 18:44
interesting
can wasm do dom manipulation yet?
Juan C. Andreu
@andreujuanc
Feb 06 2018 18:46
havent checked source yet
but maybe that part is done via callbacks
Chris Reeves
@evs-chris
Feb 06 2018 18:47
ah
Juan C. Andreu
@andreujuanc
Feb 06 2018 18:47
maybe
found file called InvokeWithJsonMarshalling.ts
Chris Reeves
@evs-chris
Feb 06 2018 18:48
I'm quite enjoying working with ts so far
Juan C. Andreu
@andreujuanc
Feb 06 2018 18:48
might not be the fastest thing out there xD
Yea it's cool, if you start something like blazor,
but the moment you do any LOB app where you need tons of dependencies, it falls apart a bit
Chris Reeves
@evs-chris
Feb 06 2018 18:50
coming from c#, it's nice to be able to tell the compiler 'I really don't care what this is, just emit this code'
I pretty much only do lob 😁
just starting a prototype on a major project
moving a legacy win forms app into browser land
Juan C. Andreu
@andreujuanc
Feb 06 2018 19:02
oh jesus xD
and i was complaining about my port from webforms to SPA
(with Ractive BTW)
About Blazor:

<p>Current count: @currentCount</p>

<button @onclick(IncrementCount)>Click me</button>

Clean
@functions {
    int currentCount = 0;

    void IncrementCount()
    {
        currentCount++;
    }
}
Chris Reeves
@evs-chris
Feb 06 2018 19:06
dunno how I feel about that @
but otherwise, yeah, that is pretty clean
Joseph
@fskreuz
Feb 06 2018 19:07

can wasm do dom manipulation yet

Last I checked, it only did memory tables. You'd have to translate memory with glue.

Saw a video where devs talked about React sending a tree to memory, do the diff in wasm, wasm responds with new tree, and React does the re-render.
Juan C. Andreu
@andreujuanc
Feb 06 2018 19:10
Exactly
just callbacks xD
NIce thing is that expensive computation can be done faster
Joseph
@fskreuz
Feb 06 2018 19:12
And all that is transparent to the consumer. You still write in plain JSX. Svelte is probably going down that path given it's already doing code gen. Ractive would be too if we get SFCs a business class seat.
Juan C. Andreu
@andreujuanc
Feb 06 2018 19:14
indeed!!!
Juan C. Andreu
@andreujuanc
Feb 06 2018 19:35

dunno how I feel about that @

I dont hate them C:

Juan C. Andreu
@andreujuanc
Feb 06 2018 19:46
not the most optimized thing ever
but
image.png
We can all learn from this project.
@fskreuz whats your current approach for Ractive's SFC?
Paul Maly
@PaulMaly_twitter
Feb 06 2018 19:52
Logo poll results
Joseph
@fskreuz
Feb 06 2018 20:00
gobble + rollup on build because treeshaking. if in a rush, ractive-load and get it over with. nothing fancy.
Juan C. Andreu
@andreujuanc
Feb 06 2018 20:27
@PaulMaly_twitter is this official?
I voted btw xD
Paul Maly
@PaulMaly_twitter
Feb 06 2018 20:56
@andreujuanc It's open-source, man, so a community has the last word.
:smile:
Also see this #3160
Paul Maly
@PaulMaly_twitter
Feb 06 2018 21:02
?
Juan C. Andreu
@andreujuanc
Feb 06 2018 21:15
I liked blue D:
xd
Paul Maly
@PaulMaly_twitter
Feb 06 2018 21:15
We didn't choose colors))) only ideas
Joseph
@fskreuz
Feb 06 2018 21:21
If colors were a criteria, i'd go for a red. It's the color of KFC, KitKat, Coca Cola and Ferrari. :+1:
Juan C. Andreu
@andreujuanc
Feb 06 2018 22:07
and THE BLOOD OF REACT DEVELOPERS!!!!
xD
AND ANGULAR
AND VUE
:fire:
btw, the falcon heavy launch was amazing
Chris Reeves
@evs-chris
Feb 06 2018 22:07
I have it on good authority that vue devs bleed a bluish green
and yes, yes it was
I was kinda expecting a big boom
the two boosters landing in unison was particularly awesome
still not sure what happened to the main stage
Juan C. Andreu
@andreujuanc
Feb 06 2018 22:15
was like when you write 100 lines of code and compiles on first try! same feeling..
heard main was ok
rumors
Paul Maly
@PaulMaly_twitter
Feb 06 2018 23:50
Ractive RealWorld example app, in the first scale, you can find here: https://ractive-realworld.now.sh/ with SSR & isomorphism.
Not all things are well tested (quick overview in Chrome only) and the codebase still doesn't look public-ready (needs to some cleaning), but in general seems it has to work. Also, you can try to disable Javascript in a browser and still be able to use the most of the functions.
Some quick metrics (except performance test):
realworld-size.png
realworld-loc.png
Paul Maly
@PaulMaly_twitter
Feb 06 2018 23:59
Current toolbox:
  • ractive (dev build)
  • ractive-events-keys
  • ractive-page (routing)
  • ractive-ready (ssr tools)
  • ractive-transitions-fade
  • ractive-transitions-slide
  • marked (for markdown support)
  • axios (http client)
  • express + some middlewares (for server-side things)