Skip to content

Instantly share code, notes, and snippets.

View unbug's full-sized avatar
🐝
Keep calm.

Unbug Lee unbug

🐝
Keep calm.
1.2k followers · 261 following
View GitHub Profile
@unbug
unbug / mediator.md
Created February 21, 2014 03:55 — forked from addyosmani/mediator.md

The dictionary refers to a Mediator as 'a neutral party who assists in negotiations and conflict resolution'.

In software engineering, a Mediator is a behavioural design pattern that allow us to expose a unified interface through which the different parts of a system may communicate. If it appears a system may have too many direct relationships between modules, it may be time to have a central point of control that modules communicate through instead. The Mediator promotes loose coupling by ensuring that instead of modules referring to each other explicitly, their interaction is handled through this central point.

If you would prefer an analogy, consider a typical airport traffic control system. A tower (Mediator) handles what planes (modules) can take off and land because all communications are done from the planes to the control tower, rather than from plane-to-plane. A centralized controller is key to the success of this system and that's really the role a mediator plays in software design.

In real-worl

@unbug
unbug / back_forward.js
Created March 15, 2014 05:26 — forked from sstephenson/back_forward.js
var detectBackOrForward = function(onBack, onForward) {
hashHistory = [window.location.hash];
historyLength = window.history.length;
return function() {
var hash = window.location.hash, length = window.history.length;
if (hashHistory.length && historyLength == length) {
if (hashHistory[hashHistory.length - 2] == hash) {
hashHistory = hashHistory.slice(0, -1);
onBack();
@unbug
unbug / criticalcss.html
Created July 22, 2014 02:57 — forked from PaulKinlan/criticalcss.html
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
<h2>Original CSS</h2>
<style style="display: block; white-space: pre; font-family: monospace">
h2 { margin:0; }
@unbug
unbug / business-models.md
Created July 23, 2014 12:42 — forked from ndarville/business-models.md

Business Models

Advertising

Models Examples
Display ads Yahoo!
Search ads Google
@unbug
unbug / python27_on_debian.sh
Created July 29, 2014 17:35 — forked from lukaslundgren/python27_on_debian.sh
sudo apt-get install build-essential libsqlite3-dev zlib1g-dev libncurses5-dev libgdbm-dev libbz2-dev libreadline5-dev libssl-dev libdb-dev
wget http://www.python.org/ftp/python/2.7.3/Python-2.7.3.tgz
tar -xzf Python-2.7.3.tgz
cd Python-2.7.3
./configure --prefix=/usr --enable-shared
make
sudo make install
cd ..
@unbug
unbug / index.md
Created September 1, 2014 15:11 — forked from mathisonian/index.md

demo gif

The final result: require() any module on npm in your browser console with browserify

This article is written to explain how the above gif works in the chrome (and other) browser consoles. A quick disclaimer: this whole thing is a huge hack, it shouldn't be used for anything seriously, and there are probably much better ways of accomplishing the same.

inspiration

My inspiration for building this was Max Ogden's Requirebin, which allows users to use a browser based editor to run custom javascript in the browser (including javascript that had require() statements that would normally need to be pre-processed using browserify).

@unbug
unbug / index.md
Last active August 29, 2015 14:06 — forked from mathisonian/index.md

demo gif

The final result: require() any module on npm in your browser console with browserify

This article is written to explain how the above gif works in the chrome (and other) browser consoles. A quick disclaimer: this whole thing is a huge hack, it shouldn't be used for anything seriously, and there are probably much better ways of accomplishing the same.

Update: There are much better ways of accomplishing the same, and the script has been updated to use a much simpler method pulling directly from browserify-cdn. See this thread for details: mathisonian/requirify#5

inspiration

@unbug
unbug / di-in-requirejs.js
Last active August 29, 2015 14:07 — forked from domenic/di-in-requirejs.js
// EntryPoint.js
define(function () {
return function EntryPoint(model1, model2) {
// stuff
};
});
// Model1.js
define(function () {
return function Model1() {
@unbug
unbug / app.js
Last active September 8, 2015 03:09 — forked from zulfajuniadi/app.js
Backbone VirtualDOM using fiduswriter/diffDOM
/*
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>VirtualDOM Example</title>
</head>
<body>
<div id="output"></div>
@unbug
unbug / what-forces-layout.md
Last active September 20, 2015 05:06 — forked from paulirish/what-forces-layout.md
What forces layout/reflow. The comprehensive list.

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.

Element

Box metrics
  • elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent
  • elem.clientLeft, elem.clientTop, elem.clientWidth, elem.clientHeight
  • elem.getClientRects(), elem.getBoundingClientRect()