oliverturner

import fs from 'fs'

import makeAwaitable from './makeAwaitable'

const fs2 = {
  open:  makeAwaitable(fs.open),
  write: makeAwaitable(fs.write),
  close: makeAwaitable(fs.close)
}

oliverturner

const timing    = performance.timing
const navStart  = timing.navigationStart
const ttfb      = timing.responseStart - navStart
const dclStart  = timing.domContentLoadedEventStart - navStart
const dclEnd    = timing.domContentLoadedEventEnd - navStart
const resources = performance.getEntriesByType('resource')
const delayDCL  = resources.filter((res) => res.responseEnd < dclStart)

oliverturner

import addHandler from './helper'
import {UPDATE_PENDING, UPDATE_LOADED, UPDATE_FAILED} from './actions';

const initialState = {};

// Handlers
const onUpdatePending = (state) => state
const onUpdateLoaded  = (state, json) => Object.assign({}, state, json);
const onUpdateFailed  = (state, err) => state;

oliverturner

Here is a checklist of all the things I need my CSS solution to handle.

I can explain any of the points. Leave a comment on the gist or tweet @DavidWells

Challenge: Take your favorite CSS solution and see how the checklist holds up.

• Has ability Localize classes
• Has ability to use global classes
• Has ability to write raw CSS
• Syntax highlighting and auto completion (beyond a specific editor)

oliverturner

const clone = (x) => [...x]

const push = (y) => (x) => [...x, y]

const pop = (x) => x.slice(0, -1)

const unshift = (y) => (x) => [y, ...x]

const shift = (x) => x.slice(1)

oliverturner

const compose = (f, g) => (...args) => f(g(...args));
const pipe = (...fns) => fns.reduceRight(compose);

const double = a => a * 2
const square = a => a * a
const increment = a => a + 1

const maths = pipe(double, square, increment)

console.log(maths(2)) // => 17

oliverturner

export const fmap = f => g => x => f(g(x));

export const curryOnce = f => x => (...args) => f(x, ...args);

export const curry = n => f => (n == 1 ? f : fmap(curry(n - 1))(curryOnce(f)));

export const method = m => m.call.bind(m);

export const methodWithArgs = n => m => curry(n)(method(m));

oliverturner

async function structuredClone(obj) {
  return new Promise(resolve => {
    const { port1, port2 } = new MessageChannel();
    port2.onmessage = evt => resolve(evt.data);
    port1.postMessage(obj);
  });
}

// Usage
const a = { a: 1, b: 2, c: [1, 2, 3], d: { person: { name: "oliver" } } };

oliverturner

const stream = require('stream')
const cache = new Map() // you might wanna use an lru here

function createCacheStream (url) {
  const buf = []
  return stream.Transform({
    transform: function (data, enc, cb) {
      buffer.push(data)
      cb(null, data)
    },

oliverturner

/**
 * @author ebidel@ (Eric Bidelman)
 * License Apache-2.0
 *
 * Shows how to use Puppeeteer's code coverage API to measure CSS/JS coverage across 
 * different points of time during loading. Great for determining if a lazy loading strategy
 * is paying off or working correctly.
 *
 * Install: 
 *   npm i puppeteer chalk cli-table