https://github.com/airbnb/native-navigation Hooray, one more navigation library, the one that was missing!

just wanted to post the same 😄

did anyone try/get VirtualizedList to work?

I’m seeing some very weird behavior trying to pass ClojureScript datastructure (a vector) in...

I *can* pass a JS object in like (cljs->js my-vector)

but I don’t want to do useless converting… (which can be pretty perf. intensive)

basically the whole app freezes completely when I try to pass in a cljs vector...

I’ve never seen anything like that

with React Native

what I did with ListView is - pass a list of ids (+ hashes maybe) as data source, and get full cljs object in render-row component

this way you avoid clj->js->clj roundtripping and loss of keyword namespaces on data

@misha I got it, I had a prop named wrong

the new VirtualizedList seems much nicer, I gotta say (after I got past the lack of documentation)

got it to work very nicely

https://gist.github.com/raspasov/e9a1008f2c0d5be2d202f0a4cdebe009

the new VirtualizedList + Om.next

@raspasov what is this for?

(def ^js/window.ReactNative ReactNative js/window.ReactNative)

*metadata specifically

so that

ClojureScript compiler can automatically infer externs

aka auto-generate them

ah, yes, thanks

I’m doing :advanced with Cljs + React Native 🙂

I forgot that future is here already

yea, it’s very, very nice … once I got into the habit to type hint all interop

it has solved almost 100% of my extern problems

the only place where I’ve seen it mess up is inside a core.async (go (loop []…)) - but I’m pretty sure that’s core.async’s fault because it probably drops metadata

the solution then is to (let [] … outside the go and type-hint there I found

one peeve I have is when a JS library or React Native itself hands me back some JS object… 😁 😑

like in this case

:renderItem (fn [^js/Object js-object] .....

and you have no choice except to manually pull out your nice immutable data out of the object nightmare 😂

so you have to write render-row component to accept obj converted from js one?

you give virtualized-list a clj map/vector, and it passes js item to render-row component/fn?

mm no… I don’t do any clj->js or js->clj conversion at all

hence the dark JS object magic in create-element-no-auto-js ..

with the (aset… )

basically your immutable data is under :data

this example expects a vector, and in general it makes sense I think, since it should be something sequentially seqable (or I guess it can be an ordered map?)

basically the react components expect JS object as props (to my understanding)

the most expensive part in (clj->js …) I believe is when you have a lot of data in there

so I (dissoc …) :data from the immutable props, turn the result into a js-object, and then “manually” aset data back into it

6 months ago when I started react native + clojurescript I didn’t realize/know how expensive the clj->js operation and back is… and I was doing it all the time but it really can hurt performance, esp on older devices

(let [[item-data _] (.-item js-object)

ah, found it in create-element-no-auto-js

use goog.obj/set though

@misha what is exactly the difference? I never quite understood how is (aset …) not good? (I think I read something by David Nolen or someone else a while ago)

https://github.com/cljs/api/issues/128#issuecomment-122271806

@misha thanks! 🙂

oh wow, been using aget for ages for js object access, never knew that it’s wrong

going through porting my old ListViews to VirtualizedList, one thing that’s explicitly WIP...

… scrollEventThrottle: 50, // TODO: Android support ..

😝

so if you need this… you might want to hold off on VirtualizedList… even though I just tried hacking the source and it *does* seem to work

scrollEventThrottle: 1 <<— seems to work, even on Android, but use with caution, I guess 🙂

@artemyarulin yea I still don’t quite understand how exactly it’s wrong but I’m going to switch to use goog.object, etc etc 🙂

yeah, weird

https://twitter.com/mattb/status/841506641048621056

I am using cljs with react native. I would not like to navigate to another screen on-press. Can please share the peace of example code to do ?