Skip to content

Instantly share code, notes, and snippets.

@peerreynders
peerreynders / index.html
Last active Oct 31, 2020
Quick'n dirty transformation benchmark
View index.html
<!doctype html>
<html lang="eng">
<!--
-->
<head>
<meta charset="utf-8"/>
<title>Transform Benchmark</title>
<style>
p {
font: 1.25em monospace;
@peerreynders
peerreynders / index.html
Last active Oct 21, 2020
Passing server generated data to client side code
View index.html
<!doctype html>
<html lang="eng">
<!--
Originally:
https://elixirforum.com/t/passing-json-between-simple-reactjs-and-phoenix-elixir/19799/6
See also:
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script#Embedding_data_in_HTML
-->
<head>
@peerreynders
peerreynders / children.html
Last active Oct 17, 2020
"Slots" in Preact
View children.html
<!doctype html>
<html lang="eng">
<!--
Based on: Getting Your Head Around Vue.js Scoped Slots - Anthony Gore
https://vuejsdevelopers.com/2017/10/02/vue-js-scoped-slots/
https://codepen.io/anthonygore/pen/zExPZX
-->
<head>
<meta charset="utf-8"/>
<title>"Slots" in Preact using children prop</title>
@peerreynders
peerreynders / es2015.js
Last active Oct 13, 2020
Differential Serving
View es2015.js
window._log('ECMAScript 2015 - with classes but no modules');
@peerreynders
peerreynders / index.html
Created Oct 13, 2020
A progressive disclosure component with regular-elements
View index.html
<!doctype html>
<html lang="eng">
<!--
"A progressive disclosure component"
https://hankchizljaw.com/wrote/a-progressive-disclosure-component/
with regular-elements
https://github.com/WebReflection/regular-elements
@peerreynders
peerreynders / index.html
Last active Sep 23, 2020
"use initializer" custom hook
View index.html
<!doctype html>
<html lang="eng">
<head>
<meta charset="utf-8"/>
<title>useInitializer</title>
</head>
<body>
<script type="module">
import { html, render, useState } from '//unpkg.com/htm/preact/standalone.mjs';
@peerreynders
peerreynders / 01before.html
Last active Sep 21, 2020
useRefreshCallback - custom hook that also avoids creating garbage functions
View 01before.html
<!doctype html>
<html lang="eng">
<head>
<meta charset="utf-8"/>
<title>useCallback alternative BEFORE</title>
</head>
<body>
<script type="module">
import {
html, render, useState, useCallback
@peerreynders
peerreynders / index.html
Created Sep 11, 2020
A progressive disclosure component with wickedElements
View index.html
<!doctype html>
<html lang="eng">
<!--
"A progressive disclosure component"
https://hankchizljaw.com/wrote/a-progressive-disclosure-component/
with wickedElements
https://github.com/WebReflection/wicked-elements
View fizzbuzz01.js
/*
**Very Rough** approximation of
fizzbuzz :: Int String
fizzbuzz n = (test 3 "fizz" test 5 "buzz") id (show n)
where
test d s x | n ‘mod‘ d 0 = const (s ++ x "")
| otherwise = x
test :: Int String (String String) String String
View firstResolvedByArrayOrderWins.js
function log(value) {
console.log(value);
}
function executor(resolve, _reject) {
const resolveValue = () => resolve('3 Resolved now');
self.setTimeout(resolveValue, 1000);
}
const pending = new Promise(executor);
You can’t perform that action at this time.