Skip to content

Instantly share code, notes, and snippets.

write, the codes

Jason Miller developit

write, the codes
Block or report user

Report or block developit

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
View transform-edge-default-params.js
/** Converts destructured parameters with default values to non-shorthand syntax, fixing Edge 16 & 17. */
module.exports = (babel, options = {}) => {
const { types: t } = babel;
const isArrowParent = p => p.parentKey=='params' && p.parentPath && p.parentPath.isArrowFunctionExpression();
return {
name: "transform-edge-default-parameters",
visitor: {
AssignmentPattern(path) {
View worlds-worst-minifier.js
export default code => code.replace(/(?:[\s\t]+\/\*[\s\S]*?\*\/[\s\t]*|\s*(\n)\s*\/\/.*(?:\n\s*\/\/.*)*)/g, '$1')
# scaffold your project
npx preact-cli@rc create default my-app && cd my-app
# upgrade to Preact X
npm i -D preact-cli@rc && npm i preact@next preact-router@next
View render-split.js
const IS_SERVER = typeof window === 'undefined';
export function RenderOnServer(props) {
return IS_SERVER ? props.children : null;
export function RenderOnClient(props) {
return IS_SERVER ? null : return props.children;
developit / package.json
Created May 30, 2019
Support for string styles in Preact X: <div style="color: red;">
View package.json
"name": "preact-string-styles",
"main": "preact-string-styles.js",
"module": "preact-string-styles.js",
"version": "0.1.0",
"homepage": ""
developit / babel-plugin-optimize-tagged-templates.js
Created May 29, 2019
Babel plugin to optimize tagged templates by inlining string/number/boolean values.
View babel-plugin-optimize-tagged-templates.js
module.exports = (babel, options = {}) => {
const { types: t } = babel;
return {
name: "optimize-tagged-templates",
visitor: {
TemplateLiteral(path) {
for (let i=0; i<path.node.expressions.length; i++) {
const expr = path.node.expressions[i];
let isLiteral = t.isStringLiteral(expr);
View next-histore-usage.js
import Link from 'next/link'
import { withRouter } from 'next/router'
import histore from 'histore'
const historyStore = histore();
const linkStyle = {
marginRight: 10
View fetch-with-retry.js
// import fetch from 'isomorphic-unfetch';
const RETRIES = 5;
* Example:
* global.fetch = fetchWithRetry;
function fetchWithRetry(url, options) {
View worker-dom-event-properties.js
'oncopy oncut onpaste onabort onblur oncancel onchange onclick onclose oncontextmenu ondblclick ondrag ondragend ondragenter ondragleave ondragover ondragstart ondrop ondurationchange onemptied onended onerror onfocus oninput oninvalid onkeydown onkeypress onkeyup onload onloadeddata onloadedmetadata onloadstart onmousedown onmouseenter onmouseleave onmousemove onmouseout onmouseover onmouseup onmousewheel onpause onprogress onreset onresize onscroll onselect onstalled onsubmit onsuspend ontoggle onwaiting onwheel onpointerdown onpointermove onpointerup onpointercancel onpointerover onpointerout onpointerenter onpointerleave onselectstart onselectionchange onbeforecopy onbeforecut onbeforepaste onsearch onfullscreenchange onfullscreenerror'
.split(' ')
.map(e => {
Element.prototype[e] = null;
View *


this isn't a library, don't use this.

it's a 1.5kb react-ey thing but using HTML instead of VDOM. diffing done via a hacked up version of set-dom.

Important Counter Demo

// this is a standard react component, except render() returns an HTML string
You can’t perform that action at this time.