Skip to content

Instantly share code, notes, and snippets.

@gasman
gasman / pnginator.rb
Created April 30, 2012 18:08
pnginator: pack Javascript into a self-extracting PNG
#!/usr/bin/env ruby -w
# pnginator.rb: pack a .js file into a PNG image with an HTML payload;
# when saved with an .html extension and opened in a browser, the HTML extracts and executes
# the javascript.
# Usage: ruby pnginator.rb input.js output.png.html
# By Gasman <http://matt.west.co.tt/>
# from an original idea by Daeken: http://daeken.com/superpacking-js-demos
@lancejpollard
lancejpollard / index.md
Created May 23, 2012 22:30
Sublime vs. Textmate Notes

In TextMate, I could press CTRL-OPTION-SHIFT-<some letter> and a popup would appear showing the languages starting with that letter. So if I pressed CTRL-OPTION-SHIFT-J, javascript, java, and json would be choices, and I could press 1 to get javascript, etc. This made it so, even if the file was a .md markdown file, I could quickly switch to javascript to get some syntax highlighting as I wrote some sample code.

In Sublime Text 2 I can do vertical block selection, but I can't do it the way vim does, and this feature has been requested before:

http://sublimetext.userecho.com/topic/61014-vintage-mode-requests/

In vim you can do CTRL-V then navigate up/down to select a block, then insert some text, for example:

Vertical Text Selection in Vim

@andreasbovens
andreasbovens / viewport-meta-in-20-best-responsive-designs.md
Created July 17, 2012 15:56
Viewport meta tags used by the 20 sites that are listed in Social Driver's "20 Best Responsive Web Design Examples of 2012"

Intro

http://socialdriver.com/2012/07/20-best-responsive-websites/ lists 20 sites that are supposedly best-in-class when it comes to responsive design techniques. I had a look at the viewport meta tags used in these sites.

Findings

  • All sites use width=device-width, with in most cases an additional initial-scale=1. This is good practice.

However:

  • 8 sites turn off pinch-zooming by setting maximum-scale to 1, or using user-scalable=no. While there are some corner use cases for this, it does not make sense to do this on text-heavy sites as it impairs accessibility.
  • 3 sites use semi-colons as delimiters between viewport values. While this works in newer mobile browsers, it's not officially supported, and breaks in older mobile browser versions.
  • 1 site has 2 viewport meta tags (with different values) in the source...
@jimmynotjim
jimmynotjim / more-mute-regex.md
Created July 19, 2012 14:37 — forked from imathis/tweetbot-mute-regex.md
Tweetbot can use regular expressions to mute tweets in your timeline and mentions.

##Simply annoying Tweets

Annoyingly extended words (4+ of the same letter in a phrase): OOOOHHHHMMMMYYYYGGGGOOOODDDD

([a-z])/1{4}

Tweet w/ just a single hashtag: #omgthissucks

^ *#[^ ]+$
@KrofDrakula
KrofDrakula / index.md
Created September 5, 2012 16:53
WebKit image rendering performance

Rendering performance on WebKit

Please send any feedback on this article to Klemen Slavič

UPDATE: I'm currently in the process of updating the article, as my assumptions about the inner workings of WebKit are incorrect. I will update this article with the relevant facts and provide concrete information in place of my guesstimates below.

I've recently stumbled upon an interesting discovery regarding image rendering performance in most WebKit browsers. Namely, I've been developing a sprite animation component to implement a GIF animation replacement with better compression and performance, where I noticed that some animations appeared to be janky when using multi-frame spritesheets and clipping rectangles. Here's what I found out.

But first, a quick rundown of the basic functioning of the WebKit engine as I understand it.

@Warry
Warry / Article.md
Created December 11, 2012 00:11
How to make faster scroll effects?

How to make faster scroll effects?

  • Avoid too many reflows (the browser to recalculate everything)
  • Use advanced CSS3 for graphic card rendering
  • Precalculate sizes and positions

Beware of reflows

The reflow appens as many times as there are frames per seconds. It recalculate all positions that change in order to diplay them. Basically, when you scroll you execute a function where you move things between two reflows. But there are functions that triggers reflows such as jQuery offset, scroll... So there are two things to take care about when you dynamically change objects in javascript to avoid too many reflows:

@calvinf
calvinf / .tmux.conf
Last active June 2, 2017 01:40
Tmux Configuration
# C-b is not acceptable -- Vim uses it
set-option -g prefix C-a
bind-key C-a last-window
# Copy mode stuff
bind-key -t vi-copy 'v' begin-selection
bind-key -t vi-copy 'x' copy-selection
bind-key 'p' run-shell "reattach-to-user-namespace pbpaste | tmux load-buffer - && tmux paste-buffer"
bind-key 'y' send-keys x\; run-shell "tmux save-buffer - | reattach-to-user-namespace pbcopy"\; display-message "copied"
module.exports = function(grunt) {
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
uglify: {
options: {
banner: '/*! <%= pkg.name %> <%= grunt.template.today("dd-mm-yyyy") %> */\n',
...
},
dist: {
files: {
@madzak
madzak / closure_and_scoping.js
Last active May 2, 2022 08:57
Javascript Interview Questions
/* Closures and Scoping */
!function(window) {
var body = window.getElementsByTagName('body')[0];
console.log(body);
}(document);
/*
Q: What would you expect the value of body to be?
@sergejmueller
sergejmueller / ttf2woff2.md
Last active November 15, 2025 22:07
WOFF 2.0 – Learn more about the next generation Web Font Format and convert TTF to WOFF2