Max Riveiro kavu

Instructions

CloudFlare is an awesome reverse cache proxy and CDN that provides DNS, free HTTPS (TLS) support, best-in-class performance settings (gzip, SDCH, HTTP/2, sane Cache-Control and E-Tag headers, etc.), minification, etc.

Make sure you have registered a domain name.
Sign up for CloudFlare and create an account for your domain.
In your domain registrar's admin panel, point the nameservers to CloudFlare's (refer to this awesome list of links for instructions for various registrars).
From the CloudFlare settings for that domain, enable HTTPS/SSL and set up a Page Rule to force HTTPS redirects. (If you want to get fancy, you can also enable automatic minification for text-based assets [HTML/CSS/JS/SVG/etc.], which is a pretty cool feature if you don't want already have a build step for minification.)
If you

Atom Clojure Setup

This describes how I setup Atom for an ideal Clojure development workflow. This fixes indentation on newlines, handles parentheses, etc. The keybinding settings for enter (in keymap.cson) are important to get proper newlines with indentation at the right level. There are other helpers in init.coffee and keymap.cson that are useful for cutting, copying, pasting, deleting, and indenting Lisp expressions.

Install Atom

Download Atom

The Atom documentation is excellent. It's highly worth reading the flight manual.

System Design Cheatsheet

Picking the right architecture = Picking the right battles + Managing trade-offs

Basic Steps

Clarify and agree on the scope of the system

User cases (description of sequences of events that, taken together, lead to a system doing something useful)
- Who is going to use it?
- How are they going to use it?

Service Worker - offline support for the web

Progressive apps - high-res icon, splash screen, no URL bar, etc.

Progressive Web Apps: Escaping Tabs Without Losing Our Soul

Mac OS X 10.11 El Capitan

Custom recipe to get OS X 10.11 El Capitan running from scratch, setup applications and developer environment. This is very similar (and currently mostly the same) as my 10.10 Yosemite setup recipe (as found on this gist https://gist.github.com/kevinelliott/0726211d17020a6abc1f). Note that I expect this to change significantly as I install El Capitan several times.

I use this gist to keep track of the important software and steps required to have a functioning system after a semi-annual fresh install. On average, I reinstall each computer from scratch every 6 months, and I do not perform upgrades between distros.

This keeps the system performing at top speeds, clean of trojans, spyware, and ensures that I maintain good organizational practices for my content and backups. I highly recommend this.

You are encouraged to fork this and modify it to your heart's content to match your own needs.

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

	<!-- 1. Go to https://vk.com/audio -->
	<!-- 2. Right click anywhere -> inspect -->
	<!-- 3. Paste this snippet as a first element of <div class="_audio_rows_header audio_rows_header fixed" (anywhere goeas, actually) -->
	<!-- 4. Press "prev/next", Ctrl/Cmd+C, right click "download" -> "save as", Ctrl/Cmd+V -->
	<!-- ... -->
	<!-- PROFIT -->
	<div style="background: white; padding: 20px;"><input type="text" id="downloadbox" style="display:block"><button onclick="getAudioPlayer().playPrev();document.getElementById('downloadbox').value = getAudioPlayer()._currentAudio[4].replace('&','&') + ' — ' + getAudioPlayer()._currentAudio[3].replace('&','&');document.getElementById('downloadlink').href = getAudioPlayer()._currentAudio[2];document.getElementById('downloadbox').focus();document.getElementById('downloadbox').select();">prev</button><button onclick="getAudioPlayer().playNext();document.getElementById('downloadbox').value = getAudioPlayer()._currentAudio[4].replace('&','&') + ' — ' + getAudioPlayer()._cu

	SELECT user, pid, client_addr, waiting, query, query_start, NOW() - query_start AS elapsed
	FROM pg_stat_activity
	WHERE query != '<IDLE>'
	-- AND EXTRACT(EPOCH FROM (NOW() - query_start)) > 1
	ORDER BY elapsed DESC;

	/**
	* Base contract that all upgradeable contracts should use.
	*
	* Contracts implementing this interface are all called using delegatecall from
	* a dispatcher. As a result, the _sizes and _dest variables are shared with the
	* dispatcher contract, which allows the called contract to update these at will.
	*
	* _sizes is a map of function signatures to return value sizes. Due to EVM
	* limitations, these need to be populated by the target contract, so the
	* dispatcher knows how many bytes of data to return from called functions.

	with table_stats as (
	select psut.relname,
	psut.n_live_tup,
	1.0 * psut.idx_scan / greatest(1, psut.seq_scan + psut.idx_scan) as index_use_ratio
	from pg_stat_user_tables psut
	order by psut.n_live_tup desc
	),
	table_io as (
	select psiut.relname,
	sum(psiut.heap_blks_read) as table_page_read,