Boye boye

Frontend Development

Attention: the list was moved to

https://github.com/dypsilon/frontend-dev-bookmarks

This page is not maintained anymore, please update your bookmarks.

Encoding Video

Installing

Install FFmpeg with homebrew. You'll need to install it with a couple flags for webm and the AAC audio codec.

brew install ffmpeg --with-libvpx --with-libvorbis --with-fdk-aac --with-opus

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

	// jQuery.support.transition
	// to verify that CSS3 transition is supported (or any of its browser-specific implementations)
	$.support.transition = (function(){
	var thisBody = document.body \|\| document.documentElement,
	thisStyle = thisBody.style,
	support = thisStyle.transition !== undefined \|\| thisStyle.WebkitTransition !== undefined \|\| thisStyle.MozTransition !== undefined \|\| thisStyle.MsTransition !== undefined \|\| thisStyle.OTransition !== undefined;

	return support;
	})();

	<!DOCTYPE html>
	<head>
	<title>Stay Standalone</title>
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
	<script src="stay_standalone.js" type="text/javascript"></script>
	</head>
	<body>
	<ul>
	<li><a href="http://google.com/">Remote Link (Google)</a></li>

	/jslint regexp: true, maxerr: 50, indent: 2 /

	(function (global) {
	"use strict";

	function URLUtils(url, baseURL) {
	var m = String(url).replace(/^\s+\|\s+$/g, "").match(/^([^:\/?#]+:)?(?:\/\/(?:([^:@\/?#])(?::([^:@\/?#]))?@)?(([^:\/?#])(?::(\d))?))?([^?#])(\?[^#])?(#[\s\S]*)?/);
	if (!m) {
	throw new RangeError();
	}


	#
	# Slightly tighter CORS config for nginx
	#
	# A modification of https://gist.github.com/1064640/ to include a white-list of URLs
	#
	# Despite the W3C guidance suggesting that a list of origins can be passed as part of
	# Access-Control-Allow-Origin headers, several browsers (well, at least Firefox)
	# don't seem to play nicely with this.
	#

	/* Polyfill indexOf. */
	var indexOf;

	if (typeof Array.prototype.indexOf === 'function') {
	indexOf = function (haystack, needle) {
	return haystack.indexOf(needle);
	};
	} else {
	indexOf = function (haystack, needle) {
	var i = 0, length = haystack.length, idx = -1, found = false;

	<?xml version="1.0"?>
	<!--
	[Your site name] XML overrides
	-->
	<layout version="0.1.0">
	<!-- updating top.links to add class names -->
	<!-- Section 1: Removing Current Links -->
	<default>
	<reference name="top.links">
	<!-- Removes 'My Account' link -->

	#!/bin/sh

	wget http://dev.mysql.com/get/Downloads/MySQL-5.6/mysql-5.6.24-osx10.9-x86_64.tar.gz
	tar xfvz mysql-5.6*

	echo "stopping mamp"
	sudo /Applications/MAMP/bin/stop.sh
	sudo killall httpd mysqld

	echo "creating backup"