Skip to content

Instantly share code, notes, and snippets.

View peebeebee's full-sized avatar

Peter Briers peebeebee

View GitHub Profile
@peebeebee
peebeebee / what-forces-layout.md
Created June 7, 2016 06:46 — forked from paulirish/what-forces-layout.md
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.

Element

Box metrics
  • elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent
  • elem.clientLeft, elem.clientTop, elem.clientWidth, elem.clientHeight
  • elem.getClientRects(), elem.getBoundingClientRect()
@peebeebee
peebeebee / gist:080fcd513af338595a09
Created October 6, 2015 14:11 — forked from dmethvin/gist:1676346
Breakpoint on access to a property
function debugAccess(obj, prop, debugGet){
var origValue = obj[prop];
Object.defineProperty(obj, prop, {
get: function () {
if ( debugGet )
debugger;
return origValue;
},
@peebeebee
peebeebee / rAF.js
Last active August 29, 2015 14:27 — forked from paulirish/rAF.js
requestAnimationFrame polyfill
// http://paulirish.com/2011/requestanimationframe-for-smart-animating/
// http://my.opera.com/emoller/blog/2011/12/20/requestanimationframe-for-smart-er-animating
// requestAnimationFrame polyfill by Erik Möller. fixes from Paul Irish and Tino Zijdel
// MIT license
(function() {
var lastTime = 0;
var vendors = ['ms', 'moz', 'webkit', 'o'];
@peebeebee
peebeebee / LICENSE
Last active August 29, 2015 14:27 — forked from ourmaninamsterdam/LICENSE
Arrayzing - The JavaScript array cheatsheet
The MIT License (MIT)
Copyright (c) 2015 Justin Perry
Permission is hereby granted, free of charge, to any person obtaining a copy of
this software and associated documentation files (the "Software"), to deal in
the Software without restriction, including without limitation the rights to
use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
the Software, and to permit persons to whom the Software is furnished to do so,
subject to the following conditions:
# Credit http://stackoverflow.com/a/2514279
for branch in `git branch -r | grep -v HEAD`;do echo -e `git show --format="%ci %cr" $branch | head -n 1` \\t$branch; done | sort -r
// By observing changes to an object with Object.observe,
// and turning on Async Call Stacks in Chrome Dev Tools,
// you can find the source of those changes.
var myObject = {
foo: 'bar'
};
Object.observe(myObject, function(changes) {
// This asynchronous callback runs when myObject is changed
@peebeebee
peebeebee / 0_reuse_code.js
Created July 1, 2014 07:24
Here are some things you can do with Gists in GistBox.
// Use Gists to store code you would like to remember later on
console.log(window); // log the "window" object to the console
@peebeebee
peebeebee / View_Model
Created August 10, 2012 18:10 — forked from cambiata/View_Model
Simplistic Kohana3 View_Model attempt
<?php defined('SYSPATH') or die('No direct script access.');
/**
*
* Simplistic View_Model attempt for Kohana 3, Based on Cambiata's viewmodel
* @author peebeebee
*/
class View extends Kohana_View {