Skip to content

Instantly share code, notes, and snippets.

Avatar
🌲
lost in the woods

Tim Branyen tbranyen

🌲
lost in the woods
View GitHub Profile
View game-of-life.js
const grid = buildGrid(20, 50, [
(10 * 50) + 20,
(10 * 50) + 21,
(10 * 50) + 22,
(10 * 50) + 23,
(10 * 50) + 24,
(10 * 50) + 25,
(10 * 50) + 26,
(10 * 50) + 27,
(10 * 50) + 28,
@tbranyen
tbranyen / diffhtml.js
Last active Apr 24, 2019
diffHTML "Calculator" Experiment
View diffhtml.js
import { innerHTML, html } from 'https://unpkg.com/diffhtml/dist/es';
let a = 1;
let b = 2;
const updateA = ({ target }) => (a = Number(target.value), render());
const updateB = ({ target }) => (b = Number(target.value), render());
function render() {
innerHTML(document.body, html`
View awhat.js
function makePromise() {
return new Promise(() => {});
}
async function main() {
console.log('start');
await makePromise();
console.log('end');
}
@tbranyen
tbranyen / console-react.jsx
Created Jan 29, 2019
A Console component for React
View console-react.jsx
const Console = props => {
for (let method in console) {
if (method in props) {
console[method](props[method]);
}
}
return <></>;
};
@tbranyen
tbranyen / hook-class.js
Created Dec 7, 2018
React Hooks in a Class
View hook-class.js
import { useState, Component } from 'react';
class MyComponent extends Component {
render() {
const [ count, setCount ] = this.state;
return (
<div>{count}</div>
);
}
@tbranyen
tbranyen / webapp.config.json
Created Oct 23, 2018
Build out ESM, CJS, UMD, Script, UMD Minified, and Script Minified
View webapp.config.json
{
"builds": [{
"input": "lib/**/*.js",
"output": "dist/esm",
"outputType": "module",
"debug": true
}, {
"input": "lib/**/*.js",
"output": "dist/cjs",
"outputType": "commonjs",
@tbranyen
tbranyen / events.js
Last active Nov 2, 2018
Rethinking events using ES6 (https://tbranyen.com/events)
View events.js
const bus = {};
const get = e => (bus[e] = bus[e] || new Set());
export const listeners = new Proxy(bus, { get });
export const emit = (e, ...args) => listeners[e].forEach(fn => fn(...args));
@tbranyen
tbranyen / cjs-treeshake.js
Last active Sep 27, 2018
CommonJS Tree Shaking Test Case
View cjs-treeshake.js
it('will treekshake a static named import', async () => {
const input = register('./a')`
const { a } = require('./b');
console.log(a);
`;
register('./b')`
function b() {}
exports.a = 'hello world';
@tbranyen
tbranyen / cjs.js
Last active Aug 30, 2018
CJS to ESM
View cjs.js
const something = require('something');
const { somethingElse } = require('something-else');
const { exports } = module;
exports.somethingElse = somethingElse;
module.exports = something;
Object.assign(module.exports, exports);
@tbranyen
tbranyen / webapp-node-api.js
Last active Aug 20, 2018
WebApp Node API Example (Experimental JS Bundler) w/ Virtual Modules
View webapp-node-api.js
const { webapp, register } = require('webapp');
async function main() {
const input = register('./input.js')`
const msg = 'Hello world!';
console.log(msg);
`;
const { source } = await webapp({
input,
You can’t perform that action at this time.