Skip to content

Instantly share code, notes, and snippets.

View cfnelson's full-sized avatar
💭
🍜

Charles Nelson cfnelson

💭
🍜
View GitHub Profile
@joshuataylor
joshuataylor / app.js
Created October 23, 2017 12:31
Preact component to notify user when a change has been made, and on route change reload the page.
import { h, Component } from 'preact';
import { Router } from 'preact-router';
import Header from './header';
import Home from '../routes/home';
import Profile from '../routes/profile';
import NotifyChange from "./NotifyChange/index";
// import Home from 'async!../routes/home';
// import Profile from 'async!../routes/profile';
export default (function create(options = {}) {
const client = {
headers: options.headers || {},
create
};
const events = {};
client.emit = (type, e) => {
events[type] &&
events[type].slice().map(fn => {
@pesterhazy
pesterhazy / indexeddb-problems.md
Last active March 12, 2026 21:01
The pain and anguish of using IndexedDB: problems, bugs and oddities

This gist lists challenges you run into when building offline-first applications based on IndexedDB, including open-source libraries like Firebase, pouchdb and AWS amplify (more).

Note that some of the following issues affect only Safari. Out of the major browsers, Chrome's IndexedDB implementation is the best.

Backing file on disk (WAL file) keeps growing (Safari)

When this bug occurs, every time you use the indexeddb, the WAL file grows. Garbage collection doesn't seem to be working, so after a while, you end up with gigabytes of data.

Random exceptions when working with a large number of indexeddb databases (Safari)

@gaearon
gaearon / CurvedArrow.js
Last active October 26, 2021 14:14
Curved SVG arrow between two objects (rects or circles) https://twitter.com/dan_abramov/status/1362255543721672704
// from/to: { left, top, width, height, shape: 'circle' | 'rect' }
function CurvedArrow({ from, to }) {
function curvedHorizontal(x1, y1, x2, y2) {
function pos(t) {
let mx = x1 + (x2 - x1) / 2;
let p1 = {x: x1, y: y1};
let p2 = {x: mx, y: y1};
let p3 = {x: mx, y: y2};
let p4 = {x: x2, y: y2};
return {
@jamiebuilds
jamiebuilds / tradeoffs-in-value-derived-types-in-typescript.md
Last active December 16, 2022 17:21
Value-derived types in TypeScript are super powerful, but you should be thoughtful in how/when you use them

Tradeoffs in value-derived types in TypeScript

Many of the more "advanced" typescript features can be used for creating "value-derived" types.

At its simplest form:

let vehicle = { name: "Van", wheels: 4 }