jeffchan

Latency Comparison Numbers
--------------------------
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

rgoldfinger

#!/usr/bin/env node
const fs = require('mz/fs');
const markdownTable = require('markdown-table');
const { spawnSync } = require('child_process');
const { memoize } = require('lodash');

const BASE = '.';
const audits = new Map();

const blacklistDirs = [

turadg

#!/usr/bin/env node
/**
 * Flowtype understands Node (or Haste) imports but not Webpack.
 *
 * Many codebases have webpack set up like:
 * src/foo.js
 * src/components/Bar.jsx
 *
 * And then import them like `require('foo')` or `require/components/Bar.jsx`
 *

aparrish

jareware

Important: At the time of writing (2019-11-11) Immutable.js is effectively abandonware, so I can no longer recommend anyone to follow the advice given here. I'll leave the article here for posterity, since it's still getting some traffic.

Understanding Immutable.Record

Functional programming principles and with it immutable data are changing the way we write frontend applications. If the recent de-facto frontend stack of React and Redux feels like it goes perfectly together with immutable data, that's because it's specifically designed for that.

There's several interesting implementations of immutable data for JavaScript, but here I'll be focusing on Facebook's own Immutable.js, and specifically on one of i

spikebrehm

The following is a list of Redux resources, as described to me by Dan Abramov.

"Real World Redux" talk

• https://www.youtube.com/watch?v=zmN0Vhx2Jgg
• https://speakerdeck.com/chrisui/real-world-redux

Reselect

• https://github.com/reactjs/reselect

Sunil Pai is building an Om Next clone in vanilla JS

vasanthk

System Design Cheatsheet

Picking the right architecture = Picking the right battles + Managing trade-offs

Basic Steps

1. Clarify and agree on the scope of the system

• User cases (description of sequences of events that, taken together, lead to a system doing something useful)
  • Who is going to use it?
  • How are they going to use it?

paulirish

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.

Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.

Element APIs

Getting box metrics

• elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent

isaacs

# Hello, and welcome to makefile basics.
#
# You will learn why `make` is so great, and why, despite its "weird" syntax,
# it is actually a highly expressive, efficient, and powerful way to build
# programs.
#
# Once you're done here, go to
# http://www.gnu.org/software/make/manual/make.html
# to learn SOOOO much more.

elfassy

#=Navigating=
    visit('/projects')
    visit(post_comments_path(post))

#=Clicking links and buttons=
    click_link('id-of-link')
    click_link('Link Text')
    click_button('Save')
    click('Link Text') # Click either a link or a button
    click_on('Button Value')