staydecent

{
  "presets": [
    "es2015",
    "react"
  ],
  "plugins": [
    "transform-es2015-spread",
    "transform-object-rest-spread",
    [
      "./node_modules/babel-plugin-jsx-import/src/index.js",

developit

An Alias to run Chrome with tracing enabled

For Chrome Canary:

alias hydra='/Applications/Google\ Chrome\ Canary.app/Contents/MacOS/Google\ Chrome\ Canary --no-sandbox --js-flags="--user-data-dir=/tmp/profile --trace-hydrogen --trace-phase=Z --trace-deopt --code-comments --hydrogen-track-positions --redirect-code-traces"'

For regular ol' Chrome:

domenic

Web components reflection

What is a subset of HTML's reflection rules which we should make easy for web components?

Summary of HTML

HTML's reflection algorithms include:

• URL strings
• Enumeration strings ("limited to only known values")

developit

Removed: Element Recycling

DOM Element recycling will be removed in Preact 8.

This should have no effect on most applications. In fact, it fixes a number of known issues related to element state not being fully reset on reuse.

💡 Why? Many DOM properties are stateful, and trying to reset them all when recycling is a game of whack-a-mole. Preact's size makes it infeasible to use whitelists to address these issues, so recycling is being dropped. >

typpo

Source

Mail Forwarding With Mailgun and CloudFlare

After moving my DNS from Namecheap to CloudFlare I lost the ability to use Namecheap as a mail forwarder. For anyone not sure what that is, essentially it allows you to receive email at [email protected] and have it automatically forwarded somewhere else (like your personal Gmail account).

So, what I did is leverage a free account with [Mailgun][1] to setup the same thing.

Mailgun Setup

TylerK

import React from 'react'
import { render } from 'react-dom';
import { Router, Route } from 'react-router-dom';
import LazyRoute from 'lazy-route';

const App = () => {
  render() {
    return (
      <Router>
        <Route

domenic

"use strict";

const worker = new Worker("worker.js");

self.onfetch = e => {
  const transform = new TransformStream(); // creates an identity transform
  e.respondWith(new Response(transform.readable));
  
  // Give the worker the writable end. An identity transform stream will just shuffle
  // bytes written there into transform.readable.

developit

const MODULE_DIR = /(.*([\/\\]node_modules|\.\.)[\/\\](@[^\/\\]+[\/\\])?[^\/\\]+)([\/\\].*)?$/g;

{
	loader: 'babel-loader',
	test: /\.jsx?$/,
	include(filepath) {
		if (filepath.split(/[/\\]/).indexOf('node_modules')===-1) return true;
		let pkg, manifest = path.resolve(filepath.replace(MODULE_DIR, '$1'), 'package.json');
		try { pkg = JSON.parse(fs.readFileSync(manifest)); } catch (e) {}
		return !!(pkg.module || pkg['jsnext:main']);

developit

import { h, Component } from 'preact';


/** Creates a new store, which is a tiny evented state container.
 *  @example
 *    let store = createStore();
 *    store.subscribe( state => console.log(state) );
 *    store.setState({ a: 'b' });   // logs { a: 'b' }
 *    store.setState({ c: 'd' });   // logs { c: 'd' }
 */

developit

import preact from 'preact';
import createFoo from './foo';
import createBar from './bar';

export const Foo = createFoo(preact);
export const Bar = createBar(preact);