Skip to content

Instantly share code, notes, and snippets.

View mzgoddard's full-sized avatar

Z Goddard mzgoddard

  • Boston, MA
View GitHub Profile
@mzgoddard
mzgoddard / fetch-response-arraybuffer-implementation.js
Created July 16, 2019 16:33
Example manual implementation of fetch().then(response => response.arrayBuffer())
// Body mixin arrayBuffer helper.
return response.arrayBuffer();
// Example implementation of arrayBuffer().
const reader = response.body.getReader();
return new Promise((resolve, reject) => {
const chunks = [];
const step = function () {
reader.read().then(({done, value}) => {
if (done) {
@mzgoddard
mzgoddard / index.html
Created July 10, 2019 17:57
Time to open an electron window.
<div class="times"></div>
<script>
const now = Date.now();
setTimeout(function () {
const div = document.querySelector('.times');
const search = location.search.substring(1).split('&').map(pair => pair.split('=')).reduce((carry, [key, value]) => {
carry[key] = Number(value);
return carry;
}, {});

cacache is far too slow as a read and write cache to disk solution for hard-source.

On one test project on an older 13" MBP:

@latest #cacache
initial build 28s 38s
iterative build 4.7s 11s

Instead of replacing, cacache will be an optional serializer like leveldb. Replacing append-serializer will fall to a new version of its idea. Instead of so finely trying to maximize use of append mode files, write out a log file once, with the meta info at the beginning and in a separate file additionally. Reading all the files in reverse builds up the prior state.

@mzgoddard
mzgoddard / scratch-webpack-4-research.md
Created April 25, 2018 21:55
Scratch webpack time and size deltas bumping to webpack 4

webpack version, loaders and plugins by repo

scratch-vm webpack@3 babel-loader [email protected] copy-webpack-plugin expose-loader file-loader script-loader

Current Problems & Scenarios

Users get fast webpack builds on large code bases by running continuous processes that watch the file system with webpack-dev-server or webpack's watch option. Starting those continuous processes can take a lot of time to build all the modules for the code base anew to fill the memory cache webpack has to make rebuilds fast. Some webpack uses remove the benefit from running a continuous process like running tests on a Continuous Integration instance that will be stopped after it runs, or making a production build for staging or release which is needed less frequently than development builds. The production build will just use more resources while the development build completes faster from not using optimization plugins.

Community solutions and workarounds help remedy this with cache-loader, DllReferencePlugin, auto-dll-plugin, thread-loader, happypack, and hard-source-webpack-plugin. Many workarounds also include option tweaks that trade small loses in file size or feature p

// Copyright 2018 Michael "Z" Goddard
//
// Permission is hereby granted, free of charge, to any person obtaining a copy
// of this software and associated documentation files (the "Software"), to deal
// in the Software without restriction, including without limitation the rights
// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
// copies of the Software, and to permit persons to whom the Software is
// furnished to do so, subject to the following conditions:
//
// The above copyright notice and this permission notice shall be included in
@mzgoddard
mzgoddard / 01.node-object-hash.sort.js
Created December 23, 2017 16:53
string-replace-webpack-plugin
const objectHash = require('node-object-hash');
console.log(objectHash({sort: false}).sort(module.exports));
// Different config content between build 1 and 2
`string-replace-webpack-plugin/loader.js?id=ay3quvgnd7k`
`string-replace-webpack-plugin/loader.js?id=z5o2gtqy17d`
// Build 1 hashed config content
`{context:/Users/zen/Code/webpack/hard-source-string-replace,entry:./index.js,ou
  • read
    • read table
    • each log
      • open
      • check block status
      • add block to file
      • if file complete emit it
  • batch put/del
    • read table
  • open current log
@mzgoddard
mzgoddard / babel-boxart-plugin-rudimentary.js
Last active November 5, 2017 17:55
Rudimentary Boxart plugin transforming bablyon tree to flatten functions
// function gen() {
// return (function(fn) {
// const f = function(t, state, begin, end) {
// var b = {b: 1};
// var c = {f2: function(t) {return t;}};
// state.left = c.f2(b.b, state, begin, end) * 2;
// return state;
// };
// return f;
// })((function(fn) {
<!DOCTYPE html>
<html>
<head>
<meta name="description" content="BoxArt animation with MutationObserver">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<style id="jsbin-css">
.column {
display: inline-block;