3 pillars that make an app native:
- touch handling (edited)
- native components
- style & layout
diving in to ReactKit in xcode
you can pass in css props and the native element will translate
setting the views happens in the main thread
but that's the only thing happening in the main thread
not transpiling js to obj-c
running a real js engine
(i think they are running js-call) hard to hear
demoing "debug in chrome"
from the iOS simulator
chrome will run the same js engine
websocket connect between ios simulator and chrome
gives you better dev tools
how do you style the native components?
"css has problems"
"we think we have a way to make it better. 'css in js'"
"we believe colocating styles with js is a good idea"
how it works? you have a style declaration
var styles={movieTitle: {background: 'red' }}}then<Text style={styles.miveTitle}>(edited) on to layout the GPU only sees boxes that are full of pixels so all it is concerned with is making those boxes only computes 4 values: Top, Left, width, and height iOS autolayout has a constraint solver (moral of the story is FB didn't like how iOS does layout) So they looked at how the web does it: CSS Box Model They like FlexBox (woo flexbox!) problem is react native doesn't have a broswer so how do they have flexbox to iOS? they wrote their own JS implementation Reimplimented flexbox with all attributes in 2 weeks React Native only reimplements a subset of CSS bridge between JS and Obj-C is: Asynchronous, batched, and serializable ported JS implementation of flexbox in C and Java open sourced a few months ago at: https://github.com/facebook/css-layout there's a file watcher with react native hit save in JS file and iOS simulator updates don't have rebuild to see visual updates (this is huge) live coding JS (js css styles) updates the iOS app view (edited) react native has great expceptions not hidden in console you get a red screen of death with the problem really nice (edited) QA about build tools "copy and paste xcode project" and then something about an internal tool they use for building (edited)