| let Rx = require(`rx`) | |
| function makeRequestProxies(drivers) { | |
| let requestProxies = {} | |
| for (let name in drivers) { | |
| if (drivers.hasOwnProperty(name)) { | |
| requestProxies[name] = new Rx.ReplaySubject(1) | |
| } | |
| } | |
| return requestProxies |
| function mapValues(obj, fn) { | |
| return Object.keys(obj).reduce((result, key) => { | |
| result[key] = fn(obj[key], key); | |
| return result; | |
| }, {}); | |
| } | |
| function pick(obj, fn) { | |
| return Object.keys(obj).reduce((result, key) => { | |
| if (fn(obj[key])) { |
All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.
Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.
elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent
| /* @flow */ | |
| type State = Object | |
| type Action = {type: string | void} | |
| type AsyncAction = (performAction: FluxPerformFunction, state: State) => void | |
| type ActionCreator = () => Action | AsyncAction | |
| type StoreFunction = (state: State, action: Action) => State |
NOTE I'm trying to find the most optimal fav/touch icon setup for my use-cases. Nothing new here. Read Mathias Bynens' articles on re-shortcut-icon and touch icons, a FAQ or a Cheat Sheet for all the details.
I'd like to hear how you approach this: @valuedstandards or comment on this gist.
You have to include a boatload of link elements pointing to many different images to provide (mobile) devices with a 'favicon' or 'touch icon':
| import { Component } from "React"; | |
| export var Enhance = ComposedComponent => class extends Component { | |
| constructor() { | |
| this.state = { data: null }; | |
| } | |
| componentDidMount() { | |
| this.setState({ data: 'Hello' }); | |
| } | |
| render() { |
2015-01-29 Unofficial Relay FAQ
Compilation of questions and answers about Relay from React.js Conf.
Disclaimer: I work on Relay at Facebook. Relay is a complex system on which we're iterating aggressively. I'll do my best here to provide accurate, useful answers, but the details are subject to change. I may also be wrong. Feedback and additional questions are welcome.
Relay is a new framework from Facebook that provides data-fetching functionality for React applications. It was announced at React.js Conf (January 2015).
| // Hello. There is now a module for this. | |
| // https://github.com/0x8890/error-class | |
| // $ npm install error-class | |
| const hasCaptureStackTrace = 'captureStackTrace' in Error | |
| // Internal function to set up an error. | |
| function setup (message) { | |
| const { constructor, constructor: { name } } = this |
While the following structure is not an absolute requirement or enforced by the tools, it is a recommendation based on what the JavaScript and in particular Node community at large have been following by convention.
Beyond a suggested structure, no tooling recommendations, or sub-module structure is outlined here.
lib/ is intended for code that can run as-issrc/ is intended for code that needs to be manipulated before it can be used
In React's terminology, there are five core types that are important to distinguish:
React Elements