Zachary Lee ZacharyL2

## SSE-Vanilla-Client.html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <style>
      @keyframes cursorBlink {
        0% {
          border-right-color: initial;

## useUrlState.ts
import { useMemo, useRef } from 'react';
import { useLocation, useNavigate } from 'react-router';

const useUrlState = <S extends Record<string, string>>(
  initialState: S,
  navigateMode: 'push' | 'replace' = 'push',
) => {
  const location = useLocation();
  const navigate = useNavigate();

## useRotateImage.ts
import { useEffect, useRef, useState } from 'react';

type RotatedImage = {
  src: string;
  width: number;
  height: number;
} | null;

let canvas: HTMLCanvasElement | null = null;
let canvasCtx2D: CanvasRenderingContext2D | null = null;

## usePrevious.js
import { useEffect, useRef } from 'react';

const usePrevious = (value) => {
  const ref = useRef();

  useEffect(() => {
    ref.current = value;
  }, [value]);

  return ref.current;

## Router.jsx
import { useEffect, useState } from 'react';

const Router = ({ routes, defaultComponent }) => {
  const [currentPath, setCurrentPath] = useState(
    () => window.location.pathname,
  );

  useEffect(() => {
    const onLocationChange = () => {
      setCurrentPath(window.location.pathname);

## readline.js
console.time('Time');

const fs = require('fs');
const readline = require('readline');

void (async () => {
  const rl = readline.createInterface({
    input: fs.createReadStream('test.json'),
    crlfDelay: Infinity,
  });

## custom-button-1.html
<custom-button backgroundColor="red"></custom-button>

<script>
  const template = `
    <style>
      button {
        background-color: blue;
        color: #fff;
      }
    </style>

## display-visibility-opacity.md

      
              1 file
            
          
              0 forks
            
          
              0 comments
            
          
              0 stars
            
          
                ZacharyL2
                / display-visibility-opacity.md
            
            
              Last active
              July 29, 2022 07:46
            
          
display: none
visibility: hidden
opacity: 0


Remove from document flow
Y
N
N


Reflow
Y
N
N


Repaint
Y
Y
/


Reversed on child element
N
Y
N


transition
N
Y
Y


Self-attached events are triggerable
N
N
Y


## generator2async.ts
const enum StepKey {
  next = 'next',
  throw = 'throw',
}

const generator2async = <
  P extends any[],
  T = unknown,
  TReturn = any,
  TNext = unknown,

## Mini-Redux.js
// Serial execution of multiple functions
const compose = (...funcs) =>
  funcs.reduce(
    (a, b) =>
      (...args) =>
        a(b(...args)),
  );

export const createStore = (reducer, enhancer) => {
  if (typeof enhancer === 'function') {
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	<meta http-equiv="X-UA-Compatible" content="ie=edge" />
	<style>
	@keyframes cursorBlink {
	0% {
	border-right-color: initial;
	import { useMemo, useRef } from 'react';
	import { useLocation, useNavigate } from 'react-router';

	const useUrlState = <S extends Record<string, string>>(
	initialState: S,
	navigateMode: 'push' \| 'replace' = 'push',
	) => {
	const location = useLocation();
	const navigate = useNavigate();
	import { useEffect, useRef, useState } from 'react';

	type RotatedImage = {
	src: string;
	width: number;
	height: number;
	} \| null;

	let canvas: HTMLCanvasElement \| null = null;
	let canvasCtx2D: CanvasRenderingContext2D \| null = null;
	import { useEffect, useRef } from 'react';

	const usePrevious = (value) => {
	const ref = useRef();

	useEffect(() => {
	ref.current = value;
	}, [value]);

	return ref.current;
	import { useEffect, useState } from 'react';

	const Router = ({ routes, defaultComponent }) => {
	const [currentPath, setCurrentPath] = useState(
	() => window.location.pathname,
	);

	useEffect(() => {
	const onLocationChange = () => {
	setCurrentPath(window.location.pathname);
	console.time('Time');

	const fs = require('fs');
	const readline = require('readline');

	void (async () => {
	const rl = readline.createInterface({
	input: fs.createReadStream('test.json'),
	crlfDelay: Infinity,
	});
	<custom-button backgroundColor="red"></custom-button>

	<script>
	const template = `
	<style>
	button {
	background-color: blue;
	color: #fff;
	}
	</style>
	display: none	visibility: hidden	opacity: 0
Remove from document flow	Y	N	N
Reflow	Y	N	N
Repaint	Y	Y	/
Reversed on child element	N	Y	N
transition	N	Y	Y
Self-attached events are triggerable	N	N	Y
	const enum StepKey {
	next = 'next',
	throw = 'throw',
	}

	const generator2async = <
	P extends any[],
	T = unknown,
	TReturn = any,
	TNext = unknown,
	// Serial execution of multiple functions
	const compose = (...funcs) =>
	funcs.reduce(
	(a, b) =>
	(...args) =>
	a(b(...args)),
	);

	export const createStore = (reducer, enhancer) => {
	if (typeof enhancer === 'function') {