These are chat archives for freeman-lab/discussion

3rd
Mar 2016
Seth Vincent
@sethvincent
Mar 03 2016 00:00
for components i've been doing a factory function thing roughly like this:
function createButton (store) {
  return function renderButton (state) {
    return hx`
      <button onclick="${store.dispatch({ type: 'click' })}">click</button>
    `
  }
}
Nicholas Sofroniew
@sofroniewn
Mar 03 2016 00:06
@sethvincent I just pushed a new version using some async function creation for timer creation
Seth Vincent
@sethvincent
Mar 03 2016 00:06
cool
Nicholas Sofroniew
@sofroniewn
Mar 03 2016 00:07
nice, the focus has been pushing all the experiment logic to the reducers and action creation
the inputs (which could be button clicks, or hardware switches) are then allowed to dispatch actions on their input events
Seth Vincent
@sethvincent
Mar 03 2016 00:08
awesome
Nicholas Sofroniew
@sofroniewn
Mar 03 2016 00:10
For now all the outputs are being set on every action using a simple render function, but we could maybe do some simple diffing to just update the things that have changed
Seth Vincent
@sethvincent
Mar 03 2016 00:10
right
Nicholas Sofroniew
@sofroniewn
Mar 03 2016 00:11
seems like it could be a nice light-weight alternative to redux, but keeping the redux conventions that I really like
Seth Vincent
@sethvincent
Mar 03 2016 00:11
sweet. i love the pattern that redux implements but babel + middleware got me interested in making that module and this one to use instead:
https://github.com/sethvincent/virtual-app
Nicholas Sofroniew
@sofroniewn
Mar 03 2016 00:12
yeah cool - i think for the hardware case the diffing will be really easy - I am not adding hardware during the middle of the experiment!! Just changing the values on a small and well defined number of pins
Seth Vincent
@sethvincent
Mar 03 2016 00:14
makes sense
reading through the logs i see mention of raspberry pi + webgl!
i've been trying to make that work
Nicholas Sofroniew
@sofroniewn
Mar 03 2016 00:15
oh cool - yeah i just started looking into that last week and then got completely side tracked by redux
i also want to try running electron on the pi
did you run into stumbling blocks?
Seth Vincent
@sethvincent
Mar 03 2016 00:16
i haven't gotten webgl to work yet, but this recent update to raspbian makes it seem achievable: https://www.raspberrypi.org/blog/another-new-raspbian-release/
electron can work though for sure
yeah, that's been my goal: raspi + electron + webgl
Nicholas Sofroniew
@sofroniewn
Mar 03 2016 00:17
yes - i am on jessie now
Seth Vincent
@sethvincent
Mar 03 2016 00:17
cool i'll have to try this new update
Nicholas Sofroniew
@sofroniewn
Mar 03 2016 00:17
:sparkles: :-)
yeah - awesome, let's stay in touch about this
have you installed chromium on the pi?
Seth Vincent
@sethvincent
Mar 03 2016 00:22
nah, i think i ran into problems getting recent chromium, moved on to other things for a bit
Jeremy Freeman
@freeman-lab
Mar 03 2016 01:35
@mathisonian @sethvincent ok this is tiny and maybe silly https://github.com/freeman-lab/hxdx
but it’s kinda what i wanted
instead of dealing with all the mapDispatch to props stuff, you can just require the dispatcher inside your components
Seth Vincent
@sethvincent
Mar 03 2016 01:39
@freeman-lab nice
Jeremy Freeman
@freeman-lab
Mar 03 2016 01:40
it doesn’t depend on redux, so i'd like to be able to swap in store-emitter
Seth Vincent
@sethvincent
Mar 03 2016 01:40
cool
yeah it's basically the same thing i wanted when i made this: https://github.com/sethvincent/virtual-app
except different dependencies
Jeremy Freeman
@freeman-lab
Mar 03 2016 01:41
ah, yes!
i guess hxdx is a little more opinionated
Jeremy Freeman
@freeman-lab
Mar 03 2016 02:03
have you thought about adding aliases so store-emitter matches the redux API?
could be cool cause then it’s a drop in replacement
might just need adding a dispatch alias?
Seth Vincent
@sethvincent
Mar 03 2016 02:07
@freeman-lab i did an awful thing and made the arguments of some methods in a different order :frowning:
i may change that
drop-in replacement would be ideal
Jeremy Freeman
@freeman-lab
Mar 03 2016 02:08
yeah that'd be really cool
just bump major version ;)
Kyle Kelley
@rgbkrk
Mar 03 2016 02:32
Hey does hyperx and virtual-dom handle the same XSS gunk that React does
Jeremy Freeman
@freeman-lab
Mar 03 2016 02:33
hmmm well hyperx can be used with react, it’s more of a standards-compatible alternative to jsx
not sure about virtual-dom and XSS though
Kyle Kelley
@rgbkrk
Mar 03 2016 02:34
ah right, the template strings
Jeremy Freeman
@freeman-lab
Mar 03 2016 02:34
yeah exactly
Gitter Robot
@gitter-robot
Mar 03 2016 02:49
ogd rgbkrk: whats the xss gunk react handles?
Kyle Kelley
@rgbkrk
Mar 03 2016 02:49
React always writes text using textContent at the very least
only way to get around it is using dangerouslySetInnerHTML
Gitter Robot
@gitter-robot
Mar 03 2016 02:50
ogd rgbkrk ah i see
Kyle Kelley
@rgbkrk
Mar 03 2016 02:50
Which we're using on the electron notebook in a few places
Jeremy Freeman
@freeman-lab
Mar 03 2016 04:49
@andrewosh just pushed some commits to https://github.com/binder-project/binder-web-redux
basic scaffold is all there and hxdx seems ro be holding up =)
Andrew Osheroff
@andrewosh
Mar 03 2016 05:12
k awesome, i'll check it out
Jeremy Freeman
@freeman-lab
Mar 03 2016 05:52
have now started adding styles
all inline
welcome to my world =)
i actually feel like i’ve found my personal front end holy grail
Nicholas Sofroniew
@sofroniewn
Mar 03 2016 06:19
:-)
Nicholas Sofroniew
@sofroniewn
Mar 03 2016 07:39
@freeman-lab quite interesting from the redux creator https://www.youtube.com/watch?v=xsSnOQynTHs
implies some of the motivation for making redux is to make better developer tools by allowing for more rapid iteration - hot reloading
Jeremy Freeman
@freeman-lab
Mar 03 2016 07:40
oh yeah def
it’s pretty cool
though i also feel the excessive complexity of some of these things engenders the need for fancy dev tools =)
Nicholas Sofroniew
@sofroniewn
Mar 03 2016 07:46
haha touche
Jeremy Freeman
@freeman-lab
Mar 03 2016 08:39
@andrewosh lots of updates
front-end.gif
Andrew Osheroff
@andrewosh
Mar 03 2016 16:21
looks great! :)
Jeremy Freeman
@freeman-lab
Mar 03 2016 16:28
@mathisonian curious to get your take, this app https://github.com/binder-project/binder-web-redux is now written entirely in the hxdx style
also realized it's more or less what’s described here reactjs/redux#1176 , and the main advantage of react-redux and the connect pattern is "performance"
Matthew Conlen
@mathisonian
Mar 03 2016 16:36
On my phone now but will take a look
Yeah to avoid re rendering every component in every state change
Jeremy Freeman
@freeman-lab
Mar 03 2016 16:38
or re-reconciling
Mikola Lysenko
@mikolalysenko
Mar 03 2016 17:03
as I understand it, redux isn't really about performance. it is there to help you keep track of state changes
since local component state in react is very error prone
eg you shouldn't do stuff like xhr in a react component, since if the component unmounts before your callback fires your app will break
redux lets you do all the stateful actions/callbacks outside your rendering components which is generally easier to deal with
Andrew Osheroff
@andrewosh
Mar 03 2016 17:37
@freeman-lab hooking your changes up to binder-client now -- things get even more interesting when you have network requests, loading panes, potentially error messages...
Jeremy Freeman
@freeman-lab
Mar 03 2016 17:41
@mikolalysenko yup totally
we’ve been finding the model really useful for reasoning about stuff, both for front-end, and for hardware control!
but for front end specifically i was complaining about the complexity of redux + react
so wanted to try simpler ways of connecting redux-like things to views
i think all the babel is just making me crotchety =)
@andrewosh have you started adding all that??
Matthew Conlen
@mathisonian
Mar 03 2016 17:44
redux / babel seems to shift the main difficulty of projects from actually coding them to setting up all the build tools
Jeremy Freeman
@freeman-lab
Mar 03 2016 17:45
ha! very true
Mikola Lysenko
@mikolalysenko
Mar 03 2016 17:45
the high set up costs are mostly due to all the es6 and babel related boilerplate
one thing that bothers me about it is that it makes it very hard to do hypermodular programming if you have so much crap that you need to generate for each project
already doing readme/package.json/license/.gitignore/test is a bit much
but then throw in a bunch of babel garbage and you get a real mess
Matthew Conlen
@mathisonian
Mar 03 2016 17:46
@freeman-lab this looks pretty cool
how are you telling hxdx where to render on the DOM?
@mikolalysenko totally agree, i’ve just been searching for good boilerplates/project generators to mitigate that but they mostly are very opinionated
Jeremy Freeman
@freeman-lab
Mar 03 2016 17:49
@mathisonian you mean where is the root node specified? yeah good call, should make it an argument
now it’s getting created automatically by main-loop
@mikolalysenko agree 100%
Matthew Conlen
@mathisonian
Mar 03 2016 17:54
ha
Kyle Kelley
@rgbkrk
Mar 03 2016 17:54
stick with Babel 5 and you don't have to load all the plugins, you get one opinionated version
;)
Matthew Conlen
@mathisonian
Mar 03 2016 17:55
it seems like they are using a fair amount of the new features https://github.com/reactjs/redux/blob/master/src/applyMiddleware.js,
Kyle Kelley
@rgbkrk
Mar 03 2016 17:55
oh totally
Matthew Conlen
@mathisonian
Mar 03 2016 17:57
@freeman-lab i like the template strings for the rendering output
Kyle Kelley
@rgbkrk
Mar 03 2016 17:58
For most projects I end up using babel-preset-es2015 and babel-preset-react, not a long list of them explicitly packaged
Jeremy Freeman
@freeman-lab
Mar 03 2016 17:58
@mathisonian yeah me too! didn’t know about until i saw https://github.com/shama/bel
its like redux backlash week
Kyle Kelley
@rgbkrk
Mar 03 2016 18:01
I'm catching flak for not using redux and going with pseudo-redux, implemented with Rx
Jeremy Freeman
@freeman-lab
Mar 03 2016 18:01
haha the funny thing is i like the core ideas so much
Kyle Kelley
@rgbkrk
Mar 03 2016 18:02
 const store = subject.scan((state, action) => {
      return reducers[action.type].call(null, state, action);
    },
    initialState || {}
  ).share();
Jeremy Freeman
@freeman-lab
Mar 03 2016 18:02
it’s changing how @sofroniewn is thinking about modular hardware design in a really cool way
@rgbkrk haha yeah i just saw nteract was making that switch
Kyle Kelley
@rgbkrk
Mar 03 2016 18:03
:)
Yeah, I was willing to entertain the Rx trial since Ken wanted to give it a go
We'll see how the sagas play out
Takes time to figure out a good model
I just hope we get to simplify
I love clean clear code
Jeremy Freeman
@freeman-lab
Mar 03 2016 18:04
and small package.jsons =)
Matthew Conlen
@mathisonian
Mar 03 2016 18:06
im going to switch to om soon and leave all this madness behind
Jeremy Freeman
@freeman-lab
Mar 03 2016 18:06
or elm! that’s what @andrewosh wants
Kyle Kelley
@rgbkrk
Mar 03 2016 18:06
that package.json from redux is more of a reduction in overall dependencies since they're babel-preset-es2015
Once we get nteract in a good state I'm probably going to tinker with implementing the notebook again in Elm on the side
Jeremy Freeman
@freeman-lab
Mar 03 2016 18:07
=)
Andrew Osheroff
@andrewosh
Mar 03 2016 18:07
oh yes
Kyle Kelley
@rgbkrk
Mar 03 2016 18:07
models are getting cleaner
Nicholas Sofroniew
@sofroniewn
Mar 03 2016 18:07
@freeman-lab i'm loving the redux philosophy - it let's all the "experiment specific logic" be placed in reducers and action creators where it can be more easily reasoned about and leaves the hardware inputs and outputs very generic
Kyle Kelley
@rgbkrk
Mar 03 2016 18:08
the problem is more of ecosystem though for a project I'd expect to be fairly large in user base
Jeremy Freeman
@freeman-lab
Mar 03 2016 18:08
@sofroniewn yup, that part is great!
Kyle Kelley
@rgbkrk
Mar 03 2016 18:08
as well as integrating with other React based frontends (here's a component you can use)
@sofroniewn totally!
Jeremy Freeman
@freeman-lab
Mar 03 2016 18:12
@rgbkrk yeah good point, i’ve been wishing all these components were somehow one level more generic, so you could share them without buying in to any particular approach
Kyle Kelley
@rgbkrk
Mar 03 2016 18:12
They all let you target DOM elements at the very least which is nice
commutable and enchannel don't force you to use React by any means at least
as evidenced by @andrewosh's hacking with the socketio backend
Andrew Osheroff
@andrewosh
Mar 03 2016 18:17
definitely a nice separation there
=^._.^=
@maxogden
Mar 03 2016 19:16
@mathisonian do you think the three new features theyre using in https://github.com/reactjs/redux/blob/master/src/applyMiddleware.js (modules, spread, arrow fns) are worth 250mb of devDependencies?
especially since none of those new features have any impact on performance, and maintenance is trivial on a 37 line file?
they wrote an event emitter library that is the size of 6 electron apps
Matthew Conlen
@mathisonian
Mar 03 2016 19:22
@maxogden haha worth it, probably not
=^._.^=
@maxogden
Mar 03 2016 19:22
i got a pr yesterday asking me to add require('npm') as a dependency to a module i maintain
so that the module could parse npm config
and i had to ask the person to find another way to do it because npm is a huge dependency
Matthew Conlen
@mathisonian
Mar 03 2016 19:23
for projects that are using the same es6 stuff it doesn't seem like a huge deal but for vanilla
lollll
=^._.^=
@maxogden
Mar 03 2016 19:24
but this babel stuff is actually 10x bigger than the npm module, which is only 21mb on disk after install
so maybe i am just too conservative :)
Matthew Conlen
@mathisonian
Mar 03 2016 19:25
I would have much more qualms about using it on a project that isn't already using Babel is what I meant above
Andrew Osheroff
@andrewosh
Mar 03 2016 19:26
what's really contributing to this size? seems like i should be able to get arrow functions for < 250mb
Jeremy Freeman
@freeman-lab
Mar 03 2016 19:26
those arrows are REALLY big
Andrew Osheroff
@andrewosh
Mar 03 2016 19:26
i mean, i'm not suggesting anyone skimp on the arrows
Matthew Conlen
@mathisonian
Mar 03 2016 19:27
Babel, putting the fat in fat arrow functions since 2015
Kyle Kelley
@rgbkrk
Mar 03 2016 19:27
I love the terseness of arrow functions up until I see them in a traceback
I rarely use them for lexical this
=^._.^=
@maxogden
Mar 03 2016 19:32
whats interesting to me about the social behavior of programmers is that since we have basically no way to scientifically measure the impact of syntax on the amount of bugs, learning curve, onboarding contributors, maintenance etc, it ends up being that everyone contributors their own successes and failures to their own style
contributes*
Kyle Kelley
@rgbkrk
Mar 03 2016 19:34
:+1:
Matthew Conlen
@mathisonian
Mar 03 2016 21:09
@maxogden yeah, agree. i think the same thing pops up across languages just via conventions/style but its so apparent in js
Seth Vincent
@sethvincent
Mar 03 2016 22:59
@freeman-lab hey, i'm running a little late. 6:15 or 6:30 p.m. ok?
Jeremy Freeman
@freeman-lab
Mar 03 2016 22:59
yup no prob
Seth Vincent
@sethvincent
Mar 03 2016 22:59
cool
Seth Vincent
@sethvincent
Mar 03 2016 23:30
@freeman-lab hey
Jeremy Freeman
@freeman-lab
Mar 03 2016 23:33
yo yo
Seth Vincent
@sethvincent
Mar 03 2016 23:33
google hangouts?
Jeremy Freeman
@freeman-lab
Mar 03 2016 23:33
yup calling you