mhart

name: CI

on: [push]

jobs:
  tslint:
    runs-on: ubuntu-latest
    strategy:
      matrix:
        job: [0, 1, 2, 3, 4]

sebmarkbage

The Rules of React

All libraries have subtle rules that you have to follow for them to work well. Often these are implied and undocumented rules that you have to learn as you go. This is an attempt to document the rules of React renders. Ideally a type system could enforce it.

What Functions Are "Pure"?

A number of methods in React are assumed to be "pure".

On classes that's the constructor, getDerivedStateFromProps, shouldComponentUpdate and render.

jsnajdr

Anti-Patterns

• too many rerenders, mostly because of inefficient selectors
• computing something just to throw it away
• initializing everything during Calypso boot

Be aware how Redux update cycle works

• action dispatch calls reducer
• reducer produces a new state (almost always)

kadamwhite

REST API Contributor Day

Plan for the day

• Improve documentation
  • Something we explain very poorly in the REST API handbook; hoping to explain it today to de-mystify
  • Handbook is what was on WP-API.org -- some stuff in there is very good and some that is out of date
  • We have some guides but they are not organized
  • We want to come up with a coherent content architecture
• Expand the endpoints presented by the API

bvaughn

React lifecycle cheatsheet

Method	Side effects1	State updates2	Example uses
Mounting
componentWillMount		✓	Constructor equivalent for createClass
render			Create and return element(s)
componentDidMount	✓	✓	DOM manipulations, network requests, etc.
Updating
componentWillReceiveProps		✓	Update state based on changed props

inexorabletash

This demonstrates the implementation of full text search for documents in Indexed DB.

• Word-breaking and stemming is used to create a list of terms for each document.
• Document records are annotated with the list of terms when added to the database.
• A multi-entry index on the list of terms is populated.
• A query is similarly processed into a list of terms.
• A join over the terms is implemented using multiple cursors on the index.

The necessity of annotating records with the word list to populate the index is a limitation of the current Indexed DB API. A feature request to support custom

developit

import { h, Component } from 'preact';
import Markup from 'preact-markup';
import register from './preact-custom-element';

// just a proxy component: WC -> Preact -> WC
const A = () => <x-b foo="initial foo from <x-a>" />;

// stateful component that can re-render
class B extends Component {
  render(props, state) {

helderco

#!/bin/bash
set -e

show_help() {
cat << EOF
Usage: ${0##*/} [-u USER] [-p PASS] [-P PORT] [-H HOST] [DATABASE]
       ${0##*/} -h

Open a standard connection in Sequel PRO.

JJediny

There are two types of markup in Liquid: Output and Tag.

• Output markup (which may resolve to text) is surrounded by

{{ matched pairs of curly brackets (ie, braces) }}

• Tag markup (which cannot resolve to text) is surrounded by

paulirish

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