Skip to content

Instantly share code, notes, and snippets.

View gbabiars's full-sized avatar

Greg Babiars gbabiars

10 followers · 0 following
View GitHub Profile
@paulirish
paulirish / what-forces-layout.md
Last active February 11, 2026 15:03
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
@iammerrick
iammerrick / PinchZoomPan.js
Last active January 26, 2026 06:44
React Pinch + Zoom + Pan
import React from 'react';
const MIN_SCALE = 1;
const MAX_SCALE = 4;
const SETTLE_RANGE = 0.001;
const ADDITIONAL_LIMIT = 0.2;
const DOUBLE_TAP_THRESHOLD = 300;
const ANIMATION_SPEED = 0.04;
const RESET_ANIMATION_SPEED = 0.08;
const INITIAL_X = 0;
@cobyism
cobyism / gh-pages-deploy.md
Last active December 7, 2025 08:10
Deploy to `gh-pages` from a `dist` folder on the master branch. Useful for use with [yeoman](http://yeoman.io).

Deploying a subfolder to GitHub Pages

Sometimes you want to have a subdirectory on the master branch be the root directory of a repository’s gh-pages branch. This is useful for things like sites developed with Yeoman, or if you have a Jekyll site contained in the master branch alongside the rest of your code.

For the sake of this example, let’s pretend the subfolder containing your site is named dist.

Step 1

Remove the dist directory from the project’s .gitignore file (it’s ignored by default by Yeoman).

@trey
trey / happy_git_on_osx.md
Last active October 9, 2025 17:52
Creating a Happy Git Environment on OS X

Creating a Happy Git Environment on OS X

Step 1: Install Git

brew install git bash-completion

Configure things:

git config --global user.name "Your Name"

git config --global user.email "you@example.com"

@dgraham
dgraham / fetch.js
Last active June 23, 2025 06:00
Simple window.fetch wrapper.
(function() {
function status(response) {
if (response.ok) {
return response
} else {
var error = new Error(response.statusText || response.status)
error.response = response
throw error
}
}
@tegansnyder
tegansnyder / disable mcafee endpoint protection.md
Last active October 29, 2024 13:49
Disable McAffee Endpoint Protection OSX

method 1

sudo /usr/local/McAfee/AntiMalware/VSControl stopoas

alternatively

sudo defaults write /Library/Preferences/com.mcafee.ssm.antimalware.plist OAS_Enable -bool False
sudo /usr/local/McAfee/AntiMalware/VSControl stop
sudo /usr/local/McAfee/AntiMalware/VSControl reload
@wycats
wycats / app.js
Last active August 2, 2024 09:53
App.Router.map(function() {
this.resource('post', { path: '/posts/:post_id' });
});
App.PostRoute = Ember.Route.extend({
model: function(params) {
return this.store.find('post', params.post_id);
}
});
@redgeoff
redgeoff / index.html
Last active March 30, 2022 06:15
Pinch Zoom And Pan With HammerJS
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport"
content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1">
<title>Pinch Zoom</title>
</head>
<body>
@gaearon
gaearon / ReduxMicroBoilerplate.js
Last active March 26, 2020 00:35
Super minimal React + Redux app
import React, { Component } from 'react';
import { createStore, combineReducers, applyMiddleware, bindActionCreators } from 'redux';
import { provide, connect } from 'react-redux';
import thunk from 'redux-thunk';
const AVAILABLE_SUBREDDITS = ['apple', 'pics'];
// ------------
// reducers
// ------------
@tomdale
tomdale / gist:3981133
Last active November 26, 2019 21:19
Ember.js Router API v2

WARNING

This gist is outdated! For the most up-to-date information, please see http://emberjs.com/guides/routing/!

It All Starts With Templates

An Ember application starts with its main template. Put your header, footer, and any other decorative content in application.handlebars.

<header>