Skip to content

Instantly share code, notes, and snippets.


Miller Medeiros millermedeiros

View GitHub Profile
branneman /
Last active March 27, 2023 09:17
Better local require() paths for Node.js

Better local require() paths for Node.js


When the directory structure of your Node.js application (not library!) has some depth, you end up with a lot of annoying relative paths in your require calls like:

const Article = require('../../../../app/models/article');

Those suck for maintenance and they're ugly.

Possible solutions

mikeal / gist:7897206
Created December 10, 2013 20:01
Animals for slaughter.
View gist:7897206

Children are created, raised, cared for and we hope that they will live a long and proud life only to end long after their creator's has ended. They are their creator's legacy.

Your code is not your child, it is an animal raised for slaughter. Your code will die. It will die before your death. Your code's entire purpose is to die. Your code enables some new function and if successful that new function will grow, it will mature, it will eventually outlive the usefullness you've provided. When successful your code creates value that outlives it and the faster the better. When unsuccessful a mercy killing is most appropriate.

Believing that our code is our children makes us territorial, protective. Nobody is allowed to kill it, only improve it. The idea that our code can be perfect, that it can change to handle so many new concerns leads to the birth of frameworks and plugin systems. These systems brutalize creativity by forcing new value to conform to the standards of our aging children.

yyx990803 / workerify.js
Last active December 17, 2015 08:09
Turn a function's body into a worker.
View workerify.js
// Turns a function's body into a worker
var workerify = function (func) {
if (typeof func !== 'function') {
throw new Error('expects a function to workerify.')
var script = func.toString().match(/^function[^{]*{((.|\n)*)}$/)[1],
blob = new Blob([script], {'type': 'application/javascript'}),
url = window.URL.createObjectURL(blob)
return new Worker(url)
pistachiomatt / sprite-generation-with-retina.scss
Last active November 5, 2019 12:28
This function generates a sprite sheet of icons, swaps it out for retina versions, and generates the "width" and "height" properties of the icons for you— automatically. Because we're lazy and have better things to do!
View sprite-generation-with-retina.scss
// Stick all your icons in a subfolder in your images folder. Put retina versions in a subfolder of that called "@2x".
$sprites: sprite-map("NAME_OF_SUBFOLDER/*.png");
$sprites2x: sprite-map("NAME_OF_SUBFOLDER/@2x/*.png");
// stolen from 37signals
@mixin retina-media() {
@media (min--moz-device-pixel-ratio: 1.3),
(-webkit-min-device-pixel-ratio: 1.3),
(min-device-pixel-ratio: 1.3),
(min-resolution: 1.3dppx) {
View gist:5052882
* __ __ _ _ ___ _
* \ \/ _\ /\/\ (_)_ __ | |_ _ _ / __\ __ ___ ___| |__
* \ \ \ / \| | '_ \| __| | | | / _\| '__/ _ \/ __| '_ \
* /\_/ /\ \ / /\/\ \ | | | | |_| |_| | / / | | | __/\__ \ | | |
* \___/\__/ \/ \/_|_| |_|\__|\__, | \/ |_| \___||___/_| |_|
* |___/
* Identifying and Eliminating Code Smells
SlexAxton / .zshrc
Last active March 15, 2023 20:29
My gif workflow
View .zshrc
gifify() {
if [[ -n "$1" ]]; then
if [[ $2 == '--good' ]]; then
ffmpeg -i $1 -r 10 -vcodec png out-static-%05d.png
time convert -verbose +dither -layers Optimize -resize 600x600\> out-static*.png GIF:- | gifsicle --colors 128 --delay=5 --loop --optimize=3 --multifile - > $1.gif
rm out-static*.png
ffmpeg -i $1 -s 600x400 -pix_fmt rgb24 -r 10 -f gif - | gifsicle --optimize=3 --delay=3 > $1.gif
roboshoes / _cover-background.scss
Last active December 13, 2015 22:09
This let's you set a background image with background-size set to cover and have it working down to IE8 (I believe also IE7?!). It's based on SCSS and uses Compass ( There is one little flaw: while the `url()` is reltive to the css file the filter is relative to the HTML document. The whole "../../" is not really clean…
View _cover-background.scss
@mixin cover-background( $path ) {
background-image: url( "../../" + $path );
@include background-size( cover );
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + $path + "', sizingMethod='scale')";
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="", sizingMethod="scale");
dergachev /
Last active March 28, 2023 16:42
OS X Screencast to animated GIF

OS X Screencast to animated GIF

This gist shows how to create a GIF screencast using only free OS X tools: QuickTime, ffmpeg, and gifsicle.

Screencapture GIF


To capture the video (filesize: 19MB), using the free "QuickTime Player" application:

Raynos /
Last active January 28, 2023 05:12
A list of minimal DOM libraries

DOM Libraries, the easy way

  • [by. Select elements][1]
  • [fragment. Turn HTML into DOMFragments][2]
  • [class-list. Cross browser HTML5 classList implementation][3]
  • [dom-walk. Traverse the DOM in tree order][4]
  • [xhr. Minimal cross browser, cross domain XHR][5]
  • [insert. Cross browser DOM4 insertion methods][6]
  • [to-array. Convert nodelists into arrays][7]
  • [hidden. Cross browser HTML5 hidden property][8]
cjohansen / gist:4135065
Created November 23, 2012 10:43
Naming this in nested functions
View gist:4135065


If you must nest functions in a way that requires access to multiple this', alias outer this to something meaningful - describe the value it's holding. Treat this as the invisible first argument.

In general though, avoiding the situation (nested functions and frivolous use of this) will frequently produce clearer results.

Naming this in nested functions

I was accidentally included in a discussion on how to best name this in nested functions in JavaScript. +1's were given to this suggestion of using _this.

Giving style advice on naming nested this without a meaningful context isn't too helpful in my opinion. Examples below have been altered to have at least some context, although a completely contrived and stupid one.