Skip to content

Instantly share code, notes, and snippets.

@paulirish
paulirish / what-forces-layout.md
Last active May 6, 2024 07:54
What forces layout/reflow. The comprehensive list.

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
@omegahm
omegahm / create_labels.sh
Created April 7, 2015 19:00
Create Gtihub labels from Bash
#!/usr/bin/env bash
# Colours picked from https://robinpowered.com/blog/best-practice-system-for-organizing-and-tagging-github-issues/
###
# Label definitions
###
declare -A LABELS
# Platform
@chriseppstein
chriseppstein / _minified_filenaming.md
Last active November 26, 2019 07:40
compiling a minified version of css. This configures your compass project to emit files in minified form when compiling for production.
$ compass compile --environment production && compass compile

Afterwards you will have both the minified and non-minified versions in your output folder. Note that compass clean will not clean up your minified files.

@turtledove999
turtledove999 / Resources.md
Last active December 24, 2015 16:19
Resources for devs to learn design
@soderlind
soderlind / config.ru
Created December 4, 2012 20:54 — forked from paulcook/config.ru
config.ru for Pow + Wordpress - based on http://stuff-things.net/2011/05/16/legacy-development-with-pow/. Added rewrite rule for WordPress Multi Site. More at http://soderlind.no/archives/2012/12/02/wordpress-and-pow/
# config.ru for Pow + Wordpress, based on http://stuff-things.net/2011/05/16/legacy-development-with-pow/
# added hackery to work around wordpress issues - Patrick Anderson (patrick@trinity-ai.com)
# added rubygems, replaced script_path with script from path_parts, added to_return to fix return error - Paul Cook
# clearly this could be cleaner, but it does work
# added rewrite rule for WordPress Multi Site - Per Soderlind (see also http://soderlind.no/archives/2012/12/02/wordpress-and-pow/)
require 'rubygems'
require 'rack'
require 'rack-legacy'
require 'rack-rewrite'
@mason-stewart
mason-stewart / fancy-symbolset.scss
Created October 31, 2012 20:36
FANCY versions of Symbolset glyphs!
// This is a peek behind the curtain at @zaarly's epic-fantasy-heavy-metal-themed internal styleguide, better known as Hammer.
//
// With this, you can add the .fancy class to a symbolset span inside of a heading tag to add a nice circular background.
// Some adjustments to the positioning of a particular glyph may be necessary.
// Each :before is set to postion: relative, so fine-tuning a .fancy glyph is simple, and won't affect the position of the circle.
//
// Example markup (in HAML):
// %h1
// %span.ss-check.fancy
// Cool Guy Settings™ saved!
@piscisaureus
piscisaureus / pr.md
Created August 13, 2012 16:12
Checkout github pull requests locally

Locate the section for your github remote in the .git/config file. It looks like this:

[remote "origin"]
	fetch = +refs/heads/*:refs/remotes/origin/*
	url = git@github.com:joyent/node.git

Now add the line fetch = +refs/pull/*/head:refs/remotes/origin/pr/* to this section. Obviously, change the github url to match your project's URL. It ends up looking like this:

@andrewrocco
andrewrocco / ga-ratio.js
Created July 17, 2012 15:48
Pixel Aspect Ratio Google Analytics Custom Variable
// Create the test
var pixelRatio = (window.devicePixelRatio >= 1.5) ? "high" : "normal";
..
// Pass it along through GA
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-xxxxxxxx-x']);
// --- IMPORTANT LINE!
// params: event method, custom variable slot, variable name, variable value, scope level
@paulirish
paulirish / gist:3098860
Created July 12, 2012 15:26
Open Conference Expectations

Open Conference Expectations

This document lays out some baseline expectations between conference speakers and conference presenters. The general goal is to maximize the value the conference provides to its attendees and community and to let speakers know what they might reasonably expect from a conference.

We believe that all speakers should reasonably expect these things, not just speakers who are known to draw large crowds, because no one is a rockstar but more people should have the chance to be one. We believe that conferences are better -- and, dare we say, more diverse -- when the people speaking are not just the people who can afford to get themselves there, either because their company paid or they foot the bill themselves. Basically, this isn't a rock show rider, it's some ideas that should help get the voices of lesser known folks heard.

These expectations should serve as a starting point for discussion between speaker and organizer. They are not a list of demands; they are a list of rea

@davatron5000
davatron5000 / gist:2254924
Created March 30, 2012 20:57
Static Site Generators

Backstory: I decided to crowdsource static site generator recommendations, so the following are actual real world suggested-to-me results. I then took those and sorted them by language/server and, just for a decent relative metric, their Github Watcher count. If you want a heap of other projects (including other languages like Haskell and Python) Nanoc has the mother of all site generator lists. If you recommend another one, by all means add a comment.

Ruby