jasonrhodes

/**
 * A function to take a string written in dot notation style, and use it to
 * find a nested object property inside of an object.
 *
 * Useful in a plugin or module that accepts a JSON array of objects, but
 * you want to let the user specify where to find various bits of data
 * inside of each custom object instead of forcing a standardized
 * property list.
 *
 * @param String nested A dot notation style parameter reference (ie "urls.small")

addyosmani

CSS Layout Debugger

A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.

One-line version to paste in your DevTools

Use $$ if your browser aliases it:

~ 108 byte version

paulirish

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

almereyda

Falsehoods programmers believe about addresses

This is an anchor-linked version of the excellent, amazing original opus magnum by Michael Tandy.

An address will start with, or at least include, a building number.

Counterexample: Royal Opera House, Covent Garden, London, WC2E 9DD, United Kingdom.

When there is a building number, it will be all-numeric.

Counterexample: 1A Egmont Road, Middlesbrough, TS4 2HT

branneman

var MY_CONSTANT = 42

// Implementation of a class
var MyClass = function () {
  // constructor
}
MyClass.prototype.getAnswer = function () {
  return MY_CONSTANT
}

timneutkens

const readline = require('readline')
const blank = '\n'.repeat(process.stdout.rows)
console.log(blank)
readline.cursorTo(process.stdout, 0, 0)
readline.clearScreenDown(process.stdout)

samthor

// UPDATE: In 2023, you should probably stop using this! The narrow version of Safari that
// does not support `nomodule` is probably not being used anywhere. The code below is left
// for posterity.

/**
 * Safari 10.1 supports modules, but does not support the `nomodule` attribute - it will
 * load <script nomodule> anyway. This snippet solve this problem, but only for script
 * tags that load external code, e.g.: <script nomodule src="nomodule.js"></script>
 *
 * Again: this will **not** prevent inline script, e.g.:

ebidel

<!-- 
Complete feature detection for ES modules. Covers:

1. Static import: import * from './foo.js';
2. Dynamic import(): import('./foo.js').then(module => {...});

Demo: http://jsbin.com/tilisaledu/1/edit?html,output

Thanks to @_gsathya, @kevincennis, @rauschma, @malyw for the help.
-->

malchata

// This is Node script that uses Puppeteer (headless Chrome) to measure the decode time
// of a single image injected into a blank HTML document. It uses minimist to take command
// line arguments. Example usage: node measure-image-decode.js https://example.com/example-image.jpg
// This example assumes you're running a local server to grab the blank document.
// Thanks to Paul Irish and Tim Kadlec for their input!

const puppeteer = require("puppeteer");
const argv = require("minimist")(process.argv.slice(2));

async function getDecode(url) {

trungpv1601

let NETWORK_PRESETS = {
  'GPRS': {
    'offline': false,
    'downloadThroughput': 50 * 1024 / 8,
    'uploadThroughput': 20 * 1024 / 8,
    'latency': 500
  },
  'Regular2G': {
    'offline': false,
    'downloadThroughput': 250 * 1024 / 8,