Skip to content

Instantly share code, notes, and snippets.

getAddressObject(address_components) {
var ShouldBeComponent = {
home: ["street_number"],
postal_code: ["postal_code"],
street: ["street_address", "route"],
region: [
"administrative_area_level_1",
"administrative_area_level_2",
"administrative_area_level_3",
"administrative_area_level_4",
///////////////////////////
// ES6 original
////////////////////////////
class A extends B {
constructor(x) {
this.x = x;
}
b() {return this.x};
}
@paulirish
paulirish / what-forces-layout.md
Last active September 23, 2024 11:37
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
@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
@elidickinson
elidickinson / max_width_email.html
Created May 6, 2013 15:10
Email Template trick: max-width with outlook
<!--[if mso]>
<center>
<table><tr><td width="580">
<![endif]-->
<div style="max-width:580px; margin:0 auto;">
<p>This text will be centered and constrained to 580 pixels even on Outlook which does not support max-width CSS</p>
</div>
<!--[if mso]>
@jayj
jayj / flexbox.less
Last active June 23, 2024 01:14
CSS3 Flexbox - LESS Mixins
// --------------------------------------------------
// Flexbox LESS mixins
// The spec: http://www.w3.org/TR/css3-flexbox
// --------------------------------------------------
// Flexbox display
// flex or inline-flex
.flex-display(@display: flex) {
display: ~"-webkit-@{display}";
display: ~"-ms-@{display}box"; // IE10 uses -ms-flexbox
@MohamedAlaa
MohamedAlaa / tmux-cheatsheet.markdown
Last active September 22, 2024 08:03
tmux shortcuts & cheatsheet

tmux shortcuts & cheatsheet

start new:

tmux

start new with session name:

tmux new -s myname
@paulirish
paulirish / rAF.js
Last active August 19, 2024 08:39
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'];
@paulirish
paulirish / data-markdown.user.js
Last active February 6, 2024 10:41
*[data-markdown] - use markdown, sometimes, in your HTML
// ==UserScript==
// @name Use Markdown, sometimes, in your HTML.
// @author Paul Irish <http://paulirish.com/>
// @link http://git.io/data-markdown
// @match *
// ==/UserScript==
// If you're not using this as a userscript just delete from this line up. It's cool, homey.