Skip to content

Instantly share code, notes, and snippets.

Avatar
🐈‍⬛
Codes with cats

Paul Armstrong paularmstrong

🐈‍⬛
Codes with cats
View GitHub Profile
View options.ts
import yargsParser from 'yargs-parser';
import Logger from './logger';
type $ObjMap<O extends {}, T> = {
[K in keyof O]: T;
};
type CommandOption = {
alias?: Array<string> | string;
description: string;
@paularmstrong
paularmstrong / pre-commit
Created Nov 25, 2010
Pre-Commit Hook for Git to add the SHA to a file in your working directory.
View pre-commit
#!/usr/bin/env node
var child_process = require('child_process'),
fs = require('fs'),
root = __dirname + '/../../',
configFile = root + 'config/config.js',
jslint = require(root + 'lib/jslint/jslint.js');
function setPushVersion() {
child_process.exec('git rev-parse HEAD', { cwd: root }, function (error, stdout, stderr) {
View HeartIcon.jsx
const HeartIcon = (props = {}) => (
<svg {...props} viewBox='0 0 ${width} ${height}'>
<g><path d='M38.723 12c-7.187 0-11.16 7.306-11.723 8.131C26.437 19.306 22.504 12 15.277 12 8.791 12 3.533 18.163 3.533 24.647 3.533 39.964 21.891 55.907 27 56c5.109-.093 23.467-16.036 23.467-31.353C50.467 18.163 45.209 12 38.723 12z'></path></g>
</svg>
);
View deferComponentRender.js
import hoistStatics from 'hoist-non-react-statics';
import React from 'react';
/**
* Allows two animation frames to complete to allow other components to update
* and re-render before mounting and rendering an expensive `WrappedComponent`.
*/
export default function deferComponentRender(WrappedComponent) {
class DeferredRenderWrapper extends React.Component {
constructor(props, context) {
@paularmstrong
paularmstrong / what-forces-layout.md
Created Aug 8, 2017 — forked from paulirish/what-forces-layout.md
What forces layout/reflow. The comprehensive list.
View what-forces-layout.md

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.

Element

Box metrics
  • elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent
  • elem.clientLeft, elem.clientTop, elem.clientWidth, elem.clientHeight
  • elem.getClientRects(), elem.getBoundingClientRect()
View webpack.config.js
const plugins = [
// extract vendor and webpack's module manifest
new webpack.optimize.CommonsChunkPlugin({
names: [ 'vendor', 'manifest' ],
minChunks: Infinity
}),
// extract common modules from all the chunks (requires no 'name' property)
new webpack.optimize.CommonsChunkPlugin({
async: true,
children: true,
@paularmstrong
paularmstrong / react-native-web_v0.x.x.js
Last active Mar 4, 2020
Ensure you add `module.name_mapper='^react-native$' -> 'react-native-web'` to your `.flowconfig` options
View react-native-web_v0.x.x.js
// @flow
// flow-typed signature: aa279642a4cb992a390fedc5acdc896d
// flow-typed version: react-native_v0.5.0/flow_v0.65.0
type RNW$Dimension = {| fontScale: number, height: number, scale: number, width: number |};
type RNW$DimensionsObject = {| window: RNW$Dimension, screen: RNW$Dimension |};
type RNW$StyleObject = { [key: string]: * };
type RNW$Style = mixed;
type RNW$Styles = RNW$StyleObject | RNW$Style | Array<RNW$Styles>;
@paularmstrong
paularmstrong / a_star.js
Created May 27, 2011 — forked from jminor/a_star.js
A* path finding algorithm for impactjs game engine
View a_star.js
/**
* AStar
*
* Created by Paul Armstrong on 2011-05-26.
* Copyright (c) 2011 Paul Armstrong Designs. All rights reserved.
*
* Based on: https://gist.github.com/827899
*/
ig.module('plugins.a-star')
View lifecycle.js
export default function(target) {
const originalMethods = {
UNSAFE_componentWillMount: target.prototype.UNSAFE_componentWillMount || noop,
componentDidMount: target.prototype.componentDidMount || noop,
UNSAFE_componentWillUpdate: target.prototype.UNSAFE_componentWillUpdate || noop,
componentDidUpdate: target.prototype.componentDidUpdate || noop,
componentWillUnmount: target.prototype.componentWillUnmount || noop
};
View Tooltip.test.tsx
/**
* Copyright (c) 2019 Paul Armstrong
*/
import React from 'react';
import { render } from 'react-testing-library';
import Tooltip from '../Tooltip';
import { Dimensions, MeasureOnSuccessCallback, View } from 'react-native';
describe('Tooltip', () => {
let viewRef;