- Good libraries aim to make themselves redundant: consider jQuery > querySelector.
- Users don't expect sites to work offline.
- Typed arrays are much quicker. Fixed length and known types mean they can be in contiguous memory.
- "Crapify"
import * as d3 from 'd3'; | |
import PropTypes from 'prop-types'; | |
import React, { PureComponent } from 'react'; | |
/** | |
* Adapter for using D3 components in React. | |
* | |
* To be compatible, D3 components must follow the reusable component convention | |
* as proposed by Mike Bostock: https://bost.ocks.org/mike/chart/ | |
* |
Companion gist for blog post: Mapping currency strength changes with D3
Displays currency strengthening or weakening against other world currencies, between a reference date in the past and today.
Try it out - click to change the base country, use the picker to change the reference date. Data is available from the start of 2000.
Uses ES6 features, so you need a modern browser.
Companion gist for blog post: Mapping currency strength changes with D3
Displays currency strengthening or weakening against other world currencies, between a reference date in the past and today.
Try it out - click to change the base country, use the picker to change the reference date. Data is available from the start of 2000.
Uses ES6 features, so you need a modern browser.
World map: https://github.com/topojson/world-atlas
# put in ~/.bashrc | |
alias git='gitwrapper' | |
gitwrapper () { | |
if [ "$1" == 'reset' ] && [ "$2" == '--hard' ]; then | |
\git status --short | |
read -n 1 -p 'Continue with hard reset (y/n)? ' answer | |
if [ "$answer" == 'y' ]; then |
Displays investment compound annual growth rates over all time frames. Rows represent start years from 1986, columns represent number of years the investment was held for.
Dynamic scale using ckmeans data clustering algorithm. This assigns the colours to groups with minimal differences in their values. A dynamic scale makes the visualisation usable on a wide variety of data, but makes it difficult to compare different sets of data (the scales would be different). In this implementation, it also results in a non-nice scale.
Inspired by the Portfolio Charts website's heat map - calculator, explanation.
FTSE All-Share Index yearly return data from http://www.swanlowpark.co.uk/ftseannual.jsp
References for CAGR calculation in code comments.
Displays investment compound annual growth rates over all time frames. Rows represent start years from 1986, columns represent number of years the investment was held for.
Inspired by the Portfolio Charts website's heat map - calculator, explanation.
FTSE All-Share Index yearly return data from http://www.swanlowpark.co.uk/ftseannual.jsp
References for CAGR calculation in code comments.
Reproduction of a real asset allocation glide path chart using D3 and D3FC.
It shows the investment fund moving towards safer assets as the target date nears.
Uses ES6 features, so you need a modern browser.
// Based on https://spectreattack.com/spectre.pdf, sections 3 mainly, 4, 4.3 | |
// Also see: https://webkit.org/blog/8048/what-spectre-and-meltdown-mean-for-webkit/ | |
const array1 = [1, 2, 3]; | |
const array1_size = 3; | |
const array2_size = (64 * 1024) / 8; | |
const array2 = new Array(array2_size); // 8192 empty 8-byte entries = 64KB. 64KB is 256*256 | |
function run() { | |
setup(); |
git gc | |
git count-objects -vH |