Daniel Steigerwald steida

Note: This is a submission for a Reactive2015 lightning talk. If you'd like to see a lightning talk about this (or read a detailed blog post if you are not going for the conference), vote for it by starring this gist! Thanks a lot!

Advanced React.js Performance

Performance is one of the reasons why React.js is so popular for building complex, highly interactive web applications. It became the go-to library for developers who don’t like to make compromises for technical reasons when building awesome user experiences. However even with React.js it still can be easy to hit it’s performance limits.

In this lightning talk Daniel will go beyond the basics of shouldComponentUpdate and immutable data structures and will discuss how to correctly instrument, measure and optimize performance in complex React apps. He will help you understand the overhead of different parts of the React component lifecycle, how some of it’

What forces layout / reflow

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.

Element APIs

Getting box metrics

elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent

The introduction to Reactive Programming you've been missing

(by @andrestaltz)

This tutorial as a series of videos

If you prefer to watch video tutorials with live-coding, then check out this series I recorded with the same contents as in this article: Egghead.io - Introduction to Reactive Programming.

In reply to "@Vlad_Roberto: No, not a programmer. I just know there's better ways to doing anything without massive energy consumption & Banks."

The problem of blockchain synchronization is the following:

Imagine you are sitting in a bunker. You have no idea what people are out there and what are their intentions. You only receive some incoming messages from strangers that may contain anything. They can be just random garbage or deliberately crafted messages to confuse you or lie to you. You never know. You cannot trust anyone.e

The problem of "money" or any other "social contract" is that everyone should be able to know what the majority agrees to without trusting some intermediaries (otherwise they can easily obuse their special position). If everyone votes for "X", then you sitting in a bunker must somehow independently figure out that all those other people indeed voted for "X" and not for "Y" or "Z". But remember: you cannot trust anyone's message and messages are the only thing you get from the outsi

Responsive layouts in stylus

Why this way?

There is no span1..15 styles, instead your css defines your layout and your html remains semantic and not polluted with display information. As it should be.
The markup is incredibly easy, you specify the wrappers width, and then each columns width in percentages. Every other grid framework I've found is incredibly complicated with this.
It allows you to have the exact same markup, and completely different styles for different devices, resolutions, stylesheets, whatever. As it should be.

	import { Component } from "React";

	export var Enhance = ComposedComponent => class extends Component {
	constructor() {
	this.state = { data: null };
	}
	componentDidMount() {
	this.setState({ data: 'Hello' });
	}
	render() {

	<!-- Raven.js Config -->
	<script src="{{ JS_PATH }}/lib/raven.js" type="text/javascript"></script>
	<script type="text/javascript">
	// Ignore list based off: https://gist.github.com/1878283
	var ravenOptions = {
	// Will cause a deprecation warning, but the demise of `ignoreErrors` is still under discussion.
	// See: https://github.com/getsentry/raven-js/issues/73
	ignoreErrors: [
	// Random plugins/extensions
	'top.GLOBALS',