This gist shows how to create a GIF screencast using only free OS X tools: QuickTime, ffmpeg, and gifsicle.
To capture the video (filesize: 19MB), using the free "QuickTime Player" application:
// early experiments with node had mysterious double requests | |
// turned out these were for the stoopid favicon | |
// here's how to short-circuit those requests | |
// and stop seeing 404 errors in your client console | |
var http = require('http'); | |
http.createServer(function (q, r) { | |
// control for favicon |
jQuery(function($) { | |
$('form[data-async]').live('submit', function(event) { | |
var $form = $(this); | |
var $target = $($form.attr('data-target')); | |
$.ajax({ | |
type: $form.attr('method'), | |
url: $form.attr('action'), | |
data: $form.serialize(), |
function onOpen() { | |
var ss = SpreadsheetApp.getActiveSpreadsheet(); | |
var menuEntries = [ {name: "Run Query", functionName: "runQuery"} ]; | |
ss.addMenu("HTTP Archive + BigQuery", menuEntries); | |
} | |
function runQuery() { | |
var projectNumber = 'httparchive'; | |
var sheet = SpreadsheetApp.getActiveSheet(); |
I wanted to figure out the fastest way to load non-critical CSS so that the impact on initial page drawing is minimal.
TL;DR: Here's the solution I ended up with: https://github.com/filamentgroup/loadCSS/
For async JavaScript file requests, we have the async
attribute to make this easy, but CSS file requests have no similar standard mechanism (at least, none that will still apply the CSS after loading - here are some async CSS loading conditions that do apply when CSS is inapplicable to media: https://gist.github.com/igrigorik/2935269#file-notes-md ).
Seems there are a couple ways to load and apply a CSS file in a non-blocking manner:
* { | |
font-size: 12pt; | |
font-family: monospace; | |
font-weight: normal; | |
font-style: normal; | |
text-decoration: none; | |
color: black; | |
cursor: default; | |
} |
Brad Frost: | |
TBC | |
Alicia Sedlock: | |
https://speakerdeck.com/aliciasedlock/jumping-into-front-end-testing | |
Richard Rutter: | |
http://webtypography.net/talks/upfront2015/ | |
Soledad Penadés: |
My reply to https://helloanselm.com/2016/open-service-worker-questions/, which sets a new record for false statements per word.
The first thing I noticed after making sure that Service Worker are enabled (Chrome is behind flags)
No they're not. They've been in stable for over a year now.
was that I found no user setting or any hint in the developer tools about service workers
There's a service worker panel in the sources tab and in the resources tab. There's also chrome://serviceworker-internals/
. The script also appears in the context dropdown (as iframes do). The script itself also appears in the sources panel. You can also type navigator.serviceWorker.controller
into the console to inspect the controlling service worker for the page.
/** | |
* Delays calling the given function until the browser is notifying us | |
* about a certain minimum budget or the timeout is reached. | |
* @param {!Window} win | |
* @param {number} startTime When we started waiting for idle. | |
* @param {number} minimumTimeRemaining Minimum number of millis idle | |
* budget for callback to fire. | |
* @param {number} timeout in millis for callback to fire. | |
* @param {function()} fn Callback. | |
*/ |