These are some notes-to-self from a variety of presentations I attended at the recent ForwardJS Conference.
- Check out the reading list at the very bottom for some homework.
How your brain is conspiring against you making good software
by Jenna Zeigen
Humans are predictably irrational.
– Dan Ariely
- We may be “rational” developers, but we’re also “irrational” humans.
- We tend to favor information/results that support our pre-existing beliefs: cognitive bias.
- We also distrust evidence that is contrary to our existing beliefs.
- We prefer things we make ourselves (pride + understanding).
- Prediction bias: we’re really bad at predicting how long it will take us to do something.
- We show a pessimistic bias toward others’ work.
- We show an optimistic bias toward our own work (more so for negative things not happening to us, than positive things happening to us).
- We tend to overestimate our own abilities.
- We prefer the status quo, and we favor people/things from our own in-group – this leads to self-selecting for homogeneity.
- We tend to favor speed/more over deliberation/less.
- Breaks are vital – some scientists claim this allows you to “forget” misleading hints.
- Selective attention – we’re pretty good at filtering out unwanted
- NOTE TO SELF: I’ve also read studies contrary to this, e.g. opposed to open floor-plan work spaces.
- Diversity – “fuller” coverage on the engineering side. Fewer blind spots.
Real-time Applications Panel
Getting data from the database to the application and back as quickly as possible.
- Question becomes: how quick is “real”? What’s the threshold for frequency/duration of polling?
- socket.io – really cool real-time app framework for Node. Guillermo spoke on this last year and it was COOL.
- We’re going to see more HTTP/2 reverse-proxy passing off to HTTP/1.1 backends.
- HTTP/2 means we can push known/required assets immediately with the main payload response, as opposed to returning the payload, then letting the server request assets.
There’s a Bookmarklet for That!
- Bookmarklet’s make things easier, less repetitive.
- Works in all browsers (or it should at least).
- Light – only runs when you click it.
- Easy to install – drag to toolbar.
- Useful examples
- Create the JS you want to use
- Create script for loading external files
- Use a bookmarklet generator
React, Omniscient, and Immutable: the gateway drugs of functional programming
shouldCOmponentUpdate()Can be used for deeper logic check on whether or not to update component, but that can be less performant than just always updating. Omniscient helps with this.
- Unidirectional data flow – actions -> app-state -> functionality/transformations -> update browser -> repeat
- Immutable allows us to skip deep value checks and instead just check if the reference object has changedx
- Steep learning curve
- Newer tech
- Simplified app state updates + data structure
- More performant state change checks
- Component-based structure promotes reusability
Building Widget Platform with Isomorphic React and Webpack
- Define normal high order container and dump components
- index.jsx is our high order container with Flux layer
- Lots of support
- Lots of assets transformation loaders and optimization plugins
Possible alternative integration: https://blog.frankdejonge.nl/rendering-reactjs-templates-server-side/
- Create component/template micro-service: send request for component with props
- Pregenerate templates that are easily accssible with placeholder input (this works okay for simple inputs), but loses interactivity (I think).
- Render templates natively in PHP with V8 engine
Advanced Front End Debugging with Google Chrome
- Save snippets (can be used for something like inserting jQuery for better debugging):
console.profile()Speaker had an amazing snippet to profile on every page interaction. Get it!
- Override default functions (e.g.
setTimeout()) to log who the caller is.
- command + alt +f = find in all files
- command + shift + c = move immediately into element select mode