Skip to content

Instantly share code, notes, and snippets.

View subhaze's full-sized avatar

Michael Russell subhaze

View GitHub Profile
@jbellenger
jbellenger / NamedChunksPlugin.js
Last active July 21, 2017 15:36
named chunks
// All webpack chunks have an identifier that is written to both the chunk and
// the chunk manifest.
//
// By default, webpack uses "int" identifiers, where the identifiers are
// sequentially generated after chunks are ordered by OccurenceOrderPlugin.
//
// The result of this is that small code changes may cause chunks to be
// reordered, leading to a cascading change of chunk ids, and a large number of
// chunk rehashes that could have been avoided.
//
@deebloo
deebloo / rxjs-worker-map.example.js
Last active August 19, 2016 17:24
A RxJs operator that runs in a new thread. https://github.com/deebloo/rxjs-worker
// https://github.com/deebloo/rxjs-worker
var observable = Observable.of([0, 1, 2, 3, 4]);
observable
.map(function (data) {
return data.concat([5, 6, 7, 8, 9]);
})
.workerMap(function (data) {
return data.concat([10,11,12,13,14]);;
})
@deanrad
deanrad / redux-distilled.md
Last active December 27, 2020 18:31
TL;DR Better Redux involves using maps of action types to reducers, not switch/case statements

Distilling the Essence of Reducers

Redux has brought the notion of reducer back into the awareness of many developers for whom they are a novel concept. In fact they are quite simple, and used all the time in such things as SUM aggregations in databases, where they compute a single value from many.

It's great that Redux has made reducers known to a broader audience, though they are relatively ancient concepts in programming, in fact. But the particular way Redux illustrates a reducer in its documentaion is, in my opinion, with a coding style that is harder to extend and read than it should be. Let's distill reducers down to their essensce, and build up Redux reducers in a way that lowers complexity, and helps separate Redux idioms from your business logic.

The simplest reducer

A reducer is a pure function that accepts more arguments than it returns. That is to say - one whose "arity" is greater than 1. It 'reduces' the two things you pass it down to a single value. Here are two reducers, in a map

@btroncone
btroncone / rxjs_operators_by_example.md
Last active July 16, 2023 14:57
RxJS 5 Operators By Example
@Avaq
Avaq / combinators.js
Last active March 18, 2024 20:49
Common combinators in JavaScript
const I = x => x
const K = x => y => x
const A = f => x => f (x)
const T = x => f => f (x)
const W = f => x => f (x) (x)
const C = f => y => x => f (x) (y)
const B = f => g => x => f (g (x))
const S = f => g => x => f (x) (g (x))
const S_ = f => g => x => f (g (x)) (x)
const S2 = f => g => h => x => f (g (x)) (h (x))
@paulirish
paulirish / what-forces-layout.md
Last active April 19, 2024 14:42
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.

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
@toolmantim
toolmantim / Makefile
Last active December 5, 2022 23:14
An example of using Make instead of Grunt for fast, simple and maintainable front-end asset compilation.
# A simple Makefile alternative to using Grunt for your static asset compilation
#
## Usage
#
# $ npm install
#
# And then you can run various commands:
#
# $ make # compile files that need compiling
# $ make clean all # remove target files and recompile from scratch
@nzakas
nzakas / type-declarations.js
Created December 14, 2012 22:27
Experiment: Simple way to define types, including prototypal inheritance, in JavaScript
/*
* This is just an experiment. Don't read too much into the fact that these are global variables.
* The basic idea is to combine the two steps of defining a constructor and modifying a prototype
* into just one function call that looks more like traditional classes and other OO languages.
*/
// Utility function
function mixin(receiver, supplier) {
if (Object.getOwnPropertyDescriptor) {
@milligramme
milligramme / bash_completion
Created January 20, 2012 08:13
brew install bash-completion
$ brew install bash-completion
==> Downloading http://bash-completion.alioth.debian.org/files/bash-completion-1.3.tar.bz2
######################################################################## 100.0%
==> ./configure --prefix=/usr/local/Cellar/bash-completion/1.3
==> make install
==> Caveats
Add the following lines to your ~/.bash_profile file:
if [ -f `brew --prefix`/etc/bash_completion ]; then
. `brew --prefix`/etc/bash_completion
fi
@rauchg
rauchg / ms.md
Created December 21, 2011 00:25
Milliseconds conversion utility.