Terkel terkelg

An Alias to run Chrome with tracing enabled

For Chrome Canary:

alias hydra='/Applications/Google\ Chrome\ Canary.app/Contents/MacOS/Google\ Chrome\ Canary --no-sandbox --js-flags="--user-data-dir=/tmp/profile --trace-hydrogen --trace-phase=Z --trace-deopt --code-comments --hydrogen-track-positions --redirect-code-traces"'

For regular ol' Chrome:

Colours in terminal

It's a common confusion about terminal colours... Actually we have this:

plain ascii
ansi escape codes (16 colour codes with bold/italic and background)
256 colour palette (216 colours + 16 ansi + 24 gray) (colors are 24bit)
24bit true colour ("888" colours (aka 16 milion))

printf "\x1b[${bg};2;${red};${green};${blue}m\n"

Using git-submodules to version-control Vim plugins

If you work across many computers (and even otherwise!), it's a good idea to keep a copy of your setup on the cloud, preferably in a git repository, and clone it on another machine when you need. Thus, you should keep the .vim directory along with your .vimrc version-controlled.

But when you have plugins installed inside .vim/bundle (if you use pathogen), or inside .vim/pack (if you use Vim 8's packages), keeping a copy where you want to be able to update the plugins (individual git repositories), as well as your vim-configuration as a whole, requires you to use git submodules.

Creating the repository

Initialize a git repository inside your .vim directory, add everything (including the vimrc), commit and push to a GitHub/BitBucket/GitLab repository:

cd ~/.vim

This isn't bullet-proof but here's how I've doing things lately:

modular ThreeJS quickie

npm install three --save
Include this in your browserify/webpack root script, typically your index.js:

global.THREE = require('three')

Add the "THREE" global to your linter (e.g. semistandard/eslintrc)

	var str = 'class ಠ_ಠ extends Array {constructor(j = "a", ...c) {const q = (({u: e}) => {return { [`s${c}`]: Symbol(j) };})({});super(j, q, ...c);}}' +
	'new Promise((f) => {const a = function* (){return "\u{20BB7}".match(/./u)[0].length === 2 \|\| true;};for (let vre of a()) {' +
	'const [uw, as, he, re] = [new Set(), new WeakSet(), new Map(), new WeakMap()];break;}f(new Proxy({}, {get: (han, h) => h in han ? han[h] ' +
	': "42".repeat(0o10)}));}).then(bi => new ಠ_ಠ(bi.rd));';

	try {
	eval(str);
	} catch(e) {
	alert('Your browser does not support ES6!')
	}

	attribute vec3 position;
	uniform mat4 modelViewMatrix;
	uniform mat4 modelMatrix;
	uniform mat4 projectionMatrix;

	uniform float scale;
	uniform float size;
	uniform float aspect;
	varying vec2 vUv;

	export function tween( time, update ) {
	const start = Date.now();

	var isCanceled = false;
	var isComplete = false;

	var chain = [];

	function loop() {
	if ( isCanceled ) return;

	uniform vec4 offsetRepeat; // from ThreeJS Texture
	uniform float time;
	#pragma glslify: noise = require('glsl-noise/simplex/2d');

	float pattern(float v, float repeats, float threshold) {
	float result = mod(v * repeats, 1.0);
	return step(threshold, result);
	}

	void main () {

	const glslify = require('glslify');
	const path = require('path');

	// This is the original source, we will copy + paste it for our own GLSL
	// const vertexShader = THREE.ShaderChunk.meshphysical_vert;
	// const fragmentShader = THREE.ShaderChunk.meshphysical_frag;

	// Our custom shaders
	const fragmentShader = glslify(path.resolve(__dirname, 'standard.frag'));
	const vertexShader = glslify(path.resolve(__dirname, 'standard.vert'));

	:root {
	--ease-in-quad: cubic-bezier(.55, .085, .68, .53);
	--ease-in-cubic: cubic-bezier(.550, .055, .675, .19);
	--ease-in-quart: cubic-bezier(.895, .03, .685, .22);
	--ease-in-quint: cubic-bezier(.755, .05, .855, .06);
	--ease-in-expo: cubic-bezier(.95, .05, .795, .035);
	--ease-in-circ: cubic-bezier(.6, .04, .98, .335);

	--ease-out-quad: cubic-bezier(.25, .46, .45, .94);
	--ease-out-cubic: cubic-bezier(.215, .61, .355, 1);