Skip to content

Instantly share code, notes, and snippets.

@ryanflorence
ryanflorence / static_server.js
Last active July 3, 2025 03:26
Node.JS static file web server. Put it in your path to fire up servers in any directory, takes an optional port argument.
var http = require("http"),
url = require("url"),
path = require("path"),
fs = require("fs")
port = process.argv[2] || 8888;
http.createServer(function(request, response) {
var uri = url.parse(request.url).pathname
, filename = path.join(process.cwd(), uri);
@matthewcrist
matthewcrist / index.html
Created September 11, 2012 19:18
Responsive vertical/horizontal image centering with CSS only
<img width="500" height="335" title="" alt="" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAfQAAAFPCAIAAAA0uatrAAA4ZElEQVR42u2d919TW9aH5++aO6YSEnrvqAgCAiIiWLCigiJ2EVBAAbGLV7BgRzqKihQBUXpNIYE0Zub96V05x8twlRIgQHLyzef53GGQkpwcnr322muv/Y/JySkAAAAc4x+4BAAAALkDAACA3AEAAEDuAAAAIHcAAACQOwAAQO4AAAAgdwAAAJA7AAAAyB0AAADkDgAAkDuuAgAAQO4AAAAgdwAAAJA7AAAAyB0AAADkDgAAkDsAAADIHQAAAOQOAAAAcgcAAAC5AwAA5I6rAAAAkDsAAADIHQAAAOQOAAAAcgcAAAC5AwAA5A4AAAByBwAAALkDAACA3AEAAEDuAAAAuQMAAIDcAQAAQO4AAAAgdwAAAJA7AAAAyB0AACB3AAAAkDsAAADIHQAAAOQOAAAAcgcAAMgdAAAA5A4AAAByBwAAALkDAACA3AEAAEDuAAAAuQMAAIDcAQAAQO4AAAAgdwAAAJA7AABA7gAAACB3AAAAkDsAAADIHQAAAOQOAAAAcgcAAMgdAAAA5A4AAAByBwAAALkDAACA3AEAAHIHAAAAuQMAAIDcAQAAQO4AAAAgdwAAAJA7AABA7gAAACB3AAAAkDsAAADIHQAAAOQOAACQOwAAAMgdAAAA5A4AAAByBwAAALkDAACA3AEAAHIHAAAAuQMAAIDcAQAAQO4AAAAgdwAAgNwBAABA7gAAACB3AAAAkDsAAADIHQAAAOQOAACQOwAAAMgdAAAA5A4AAAByBwAAALkDAADkDgAAAHIHAAAAuQMAAIDcAQAAQO4AAAAgdwAAgNwBAABA7gAAACB3AAAAkDsAAADIHQCwUqamtOaDywW5AwBsgIkJ9fi4fFwuVypVC6NSTajVGu2U1mAw6vVGiB5yBwAsJ5rWanU6nUF
/** @jsx React.DOM */
var MyRootComponent = React.createClass({
getInitialState: function() {
return {perMinute: '-', perDay: '-'};
},
componentDidMount: function() {
var socket = io.connect(this.props.url);
socket.on('business.clickout', this.setState.bind(this));
},
render: function() {
@bendc
bendc / functional-utils.js
Last active December 25, 2025 22:31
A set of pure ES2015 functions aimed to make functional JavaScript more idiomatic.
// array utils
// =================================================================================================
const combine = (...arrays) => [].concat(...arrays);
const compact = arr => arr.filter(Boolean);
const contains = (() => Array.prototype.includes
? (arr, value) => arr.includes(value)
: (arr, value) => arr.some(el => el === value)
@bendc
bendc / nodelist-iteration.js
Created January 13, 2015 14:39
ES6: Iterating over a NodeList
var elements = document.querySelectorAll("div"),
callback = (el) => { console.log(el); };
// Spread operator
[...elements].forEach(callback);
// Array.from()
Array.from(elements).forEach(callback);
// for...of statement
@paulirish
paulirish / what-forces-layout.md
Last active April 23, 2026 06:04
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
@ayamflow
ayamflow / gist:b602ab436ac9f05660d9c15190f4fd7b
Created May 9, 2016 19:10
Safari border-radius + overflow: hidden + CSS transform fix
// Add on element with overflow
-webkit-mask-image: -webkit-radial-gradient(white, black);
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!')
}
const price = 1234.567;
const formattedPrice = price.toLocaleString('en', {
style: 'currency',
currency: 'USD'
});
console.log(formattedPrice); // "$1,234.57"
@JamieMason
JamieMason / es6-compose.md
Last active May 17, 2022 17:38
ES6 JavaScript compose function

ES6 JavaScript Compose Function

Definition

const compose = (...fns) =>
  fns.reduceRight((prevFn, nextFn) =>
    (...args) => nextFn(prevFn(...args)),
    value => value
 );