- Install Xcode (Avaliable on the Mac App Store)
- Install Xcode Command Line Tools (Preferences > Downloads)
- Install depot_tools
$ git clone https://chromium.googlesource.com/chromium/tools/depot_tools.git
$ nano ~/.zshrc
- Add
path=('/path/to/depot_tools' $path)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// data comes from here http://stat-computing.org/dataexpo/2009/the-data.html | |
// download 1994.csv.bz2 and unpack by running: cat 1994.csv.bz2 | bzip2 -d > 1994.csv | |
// 1994.csv should be ~5.2 million lines and 500MB | |
// importing all rows into leveldb took ~50 seconds on my machine | |
// there are two main techniques at work here: | |
// 1: never create JS objects, leave the data as binary the entire time (binary-split does this) | |
// 2: group lines into 16 MB batches, to take advantage of leveldbs batch API (byte-stream does this) | |
var level = require('level') |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var levelup = require("levelup") | |
var path = __dirname + "db" | |
var options = {encoding: "json"} | |
var db = levelup(path, options) | |
function id(cb) { | |
if (typeof cb != "function") throw new TypeError | |
if (!id.queue) { | |
id.queue = [] |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<div id="map-buttons" class="btn-group" data-toggle="buttons-checkbox"> | |
<button id="layer1" class="btn active">Layer 1</button> | |
<button id="layer2" class="btn active">Layer 2</button> | |
<button id="layer3" class="btn active">Layer 3</button> | |
</div> | |
<script type="text/javascript"> | |
// Setup "layer" arrays | |
layer1Array = new Array(); | |
layer2Array = new Array(); |
- Avoid too many reflows (the browser to recalculate everything)
- Use advanced CSS3 for graphic card rendering
- Precalculate sizes and positions
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: