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:
| Latency Comparison Numbers (~2012) | |
| ---------------------------------- | |
| L1 cache reference 0.5 ns | |
| Branch mispredict 5 ns | |
| L2 cache reference 7 ns 14x L1 cache | |
| Mutex lock/unlock 25 ns | |
| Main memory reference 100 ns 20x L2 cache, 200x L1 cache | |
| Compress 1K bytes with Zippy 3,000 ns 3 us | |
| Send 1K bytes over 1 Gbps network 10,000 ns 10 us | |
| Read 4K randomly from SSD* 150,000 ns 150 us ~1GB/sec SSD |
| ### | |
| The main requirejs file | |
| ### | |
| require.config | |
| paths: | |
| "jquery": "vendor/jquery.min" | |
| "underscore": "vendor/lodash.min" | |
| "backbone": "vendor/backbone-min" |
| (function($){ | |
| var addClass = $.fn.addClass; | |
| $.fn.addClass = function(value) { | |
| var orig = addClass.apply(this, arguments); | |
| var elem, | |
| i = 0, | |
| len = this.length; | |
| for (; i < len; i++ ) { |
| (function($){ | |
| /* addClass shim | |
| ****************************************************/ | |
| var addClass = $.fn.addClass; | |
| $.fn.addClass = function(value) { | |
| var orig = addClass.apply(this, arguments); | |
| var elem, | |
| i = 0, |
| var gulp = require('gulp'); | |
| var clean = require('gulp-clean'); | |
| var jshint = require('gulp-jshint'); | |
| var concat = require('gulp-concat'); | |
| var uglify = require('gulp-uglify'); | |
| var imagemin = require('gulp-imagemin'); | |
| var bases = { | |
| app: 'app/', |
| /* border-serrated - a zig zag triangle border with linear gradient | |
| */ | |
| @mixin border-top-serrated($size, $color-outer) { | |
| & { | |
| position: relative; | |
| overflow: auto; | |
| padding-top: $size; | |
| } | |
| &:before { | |
| top: 0px; |
| /* | |
| border-serrated - a zig zag triangle border with linear gradient | |
| original SASS version: https://gist.github.com/justinmc/9837998 | |
| */ | |
| .border-top-serrated(@size, @colorOuter) { | |
| & { | |
| position: relative; | |
| padding-top: @size; | |
| } | |
| &:before { |
| /**~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ | |
| * Anchor Smooth Scroll - Smooth scroll to the given anchor on click | |
| * adapted from this stackoverflow answer: http://stackoverflow.com/a/21918502/257494 | |
| ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ | |
| angular.module('yourapp').directive('anchorSmoothScroll', function($location) { | |
| 'use strict'; | |
| return { | |
| restrict: 'A', | |
| replace: false, |
| # ag <https://github.com/ggreer/the_silver_searcher> | |
| # usage: ag-replace.sh [search] [replace] | |
| # caveats: will choke if either arguments contain a forward slash | |
| # notes: will back up changed files to *.bak files | |
| ag -0 -l $1 | xargs -0 perl -pi.bak -e "s/$1/$2/g" | |
| # or if you prefer sed's regex syntax: | |
| ag -0 -l $1 | xargs -0 sed -ri.bak -e "s/$1/$2/g" |