tomhicks

/*
Copy this into the console of any web page that is interactive and doesn't
do hard reloads. You will hear your DOM changes as different pitches of
audio.

I have found this interesting for debugging, but also fun to hear web pages
render like UIs do in movies.
*/

const audioCtx = new (window.AudioContext || window.webkitAudioContext)()

adactio

// Licensed under a CC0 1.0 Universal (CC0 1.0) Public Domain Dedication
// http://creativecommons.org/publicdomain/zero/1.0/

// HTML files: try the network first, then the cache.
// Other files: try the cache first, then the network.
// Both: cache a fresh version if possible.
// (beware: the cache will grow and grow; there's no cleanup)

const cacheName = 'files';

crittermike

# One liner
wget --recursive --page-requisites --adjust-extension --span-hosts --convert-links --restrict-file-names=windows --domains yoursite.com --no-parent yoursite.com

# Explained
wget \
     --recursive \ # Download the whole site.
     --page-requisites \ # Get all assets/elements (CSS/JS/images).
     --adjust-extension \ # Save files with .html on the end.
     --span-hosts \ # Include necessary assets from offsite as well.
     --convert-links \ # Update links to still work in the static version.

ChrisChares

async/await with ES6 Generators & Promises

This vanilla ES6 function async allows code to yield (i.e. await) the asynchronous result of any Promise within. The usage is almost identical to ES7's async/await keywords.

async/await control flow is promising because it allows the programmer to reason linearly about complex asynchronous code. It also has the benefit of unifying traditionally disparate synchronous and asynchronous error handling code into one try/catch block.

This is expository code for the purpose of learning ES6. It is not 100% robust. If you want to use this style of code in the real world you might want to explore a well-tested library like co, task.js or use async/await with Babel. Also take a look at the official async/await draft section on desugaring.

Compatibility

• node.js - 4.3.2+ (maybe earlier with

greim

// created by greg reimer ("gregreimer" at gmail) http://obadger.com/

function createHistogram(rFunc) {
	var arr = [];
	var size = 30;
	for (var i=0; i<size; i++){
		arr[i] = 0;
	}
	for (var i=0; i<1000000; i++){
		arr[Math.floor(rFunc() * size)]++;

jed

(tl;dr DOM builders like [domo][domo] trump HTML templates on the client.)

Like all web developers, I've used a lot of template engines. Like most, I've also written a few of them, some of which even [fit in a tweet][140].

The first open-source code I ever wrote was also one of the the first template engines for node.js, [a port][node-tmpl] of the mother of all JavaScript template engines, [John Resig][jresig]'s [micro-templates][tmpl]. Of course, these days you can't swing a dead cat without hitting a template engine; one in eight packages on npm ([2,220][npm templates] of 16,226 as of 10/19) involve templates.

John's implementation has since evolved and [lives on in Underscore.js][underscore], which means it's the default choice for templating in Backbone.js. And for a while, it's all I would ever use when building a client-side app.

But I can't really see the value in client-side HTML templates anymore.

nicoleslaw

Tiny Content Framework

About the project

This is a tiny content strategy framework focused on goals, messages, and branding. This is not a checklist. Use what you need and scrap the rest. Rewrite it or add to it. These topics should help you get to the bottom of things with clients and other people you work with.

Give me feedback on Twitter (@nicoleslaw) or by email (nicole@nicolefenton.com).

Contents

benbalter

// Conditionally Load jQuery (javascript)
// Source: https://gist.github.com/gists/902090/
var init, maybeLoadJq;

init = function() {
  jQuery(document).ready(function() {
    alert('Your Code Here');
  });
};