Miklos Megyes miklosme

Huh?

So basically FlowType doesn't know about CSS Modules, a really handy way of dealing with the plagues of CSS in codebases (global variables and dependency wackiness mainly).

What WebPack allows us to do is "require" CSS files and use their class names:

import styles from "my_styles.css";
import React from "react";

React Component Lifecycle

getInitialState
getDefaultProps
componentWillMount
componentDidMount
shouldComponentUpdate (Update only)
componentWillUpdate (Update only)
componentWillReceiveProps (Update only)
render

What is React Fiber? And how can I try it out today?

what?

React Fiber is an ongoing reimplementation of React's core algorithm. It is the culmination of over two years of research by the React team.

why?

(also know as lies and/or alternative facts)

js

setImmediate - doesn't set anything immediately, waits for a tick before executing
setTimeout(fn, n) - never sets the timeout to exactly n
Math.random() - computers cannot generate random numbers
Promise - is a lie when rejected
Array.reduce - accumulates, does not reduce (via @sbmadhav)

	//
	// BackgroundTask.h
	// tomtrack
	//
	// Created by Liam Edwards-Playne on 13/02/2016.
	//

	#import "RCTBridgeModule.h"

	@interface BackgroundTask : NSObject <RCTBridgeModule>

	import android.util.Base64;
	import android.util.Log;
	import com.bugsnag.android.Bugsnag;
	import com.bugsnag.android.MetaData;
	import com.bugsnag.android.Severity;
	import com.facebook.react.bridge.*;

	import java.io.File;
	import java.io.InputStream;

	// The following code is licensed under the MIT license: https://gist.github.com/TheRealMJP/bc503b0b87b643d3505d41eab8b332ae

	// Samples a texture with Catmull-Rom filtering, using 9 texture fetches instead of 16.
	// See http://vec3.ca/bicubic-filtering-in-fewer-taps/ for more details
	float4 SampleTextureCatmullRom(in Texture2D<float4> tex, in SamplerState linearSampler, in float2 uv, in float2 texSize)
	{
	// We're going to sample a a 4x4 grid of texels surrounding the target UV coordinate. We'll do this by rounding
	// down the sample location to get the exact center of our "starting" texel. The starting texel will be at
	// location [1, 1] in the grid, where [0, 0] is the top left corner.
	float2 samplePos = uv * texSize;

	/*
	Basic Sprite Shader for aligning pixel art to the same grid, based on the Unity Sprite Shader.
	Create one Material where you assign the same Pixels Per Unit value you use on your imported Sprites,
	then reuse this Material on all appropriate Sprite Renderers.
	(You can use Shader.SetGlobalFloat to set that Pixels Per Unit value for all your shaders:
	https://docs.unity3d.com/ScriptReference/Shader.SetGlobalFloat.html)

	This is not for scaled or rotated artwork. If you need those features, look at low res render textures.

	Use this however you want.

	// inifinite scrolling of content without extra wrappers
	const { render, findDOMNode } = ReactDOMFiber

	class App extends React.Component {
	render() {
	// wrap the root element with an Intersection Observer, exposing .observe for children
	return <Intersection>
	<div style={{ height: 200, overflow: 'auto' }}>
	<Page offset={0} count={10} />
	</div>

	var PIXI = require('pixi.js')
	console.log(PIXI)