Skip to content

Instantly share code, notes, and snippets.

Avatar

Gray Zhang otakustay

View GitHub Profile
@otakustay
otakustay / index.ts
Created Mar 23, 2021
balanced-unique
View index.ts
function optimizedRemove<T>(sets: Array<Set<T>>, value: T): void {
// 如果N个数组中都有这个元素,那么我们只保留长度最短的数组中的那一份,其它的都删掉
const containedSets = sets.filter(s => s.has(value));
const setWithMinSize = containedSets.reduce((out, current) => (current.size <= out.size ? current : out));
containedSets.filter(s => s !== setWithMinSize).forEach(s => s.delete(value));
}
function makeBalancedUnique<T>(values: T[][]): T[][] {
// 转成Set,这样判断元素是否存在、删除元素性能更高
const sets = values.map(v => new Set(v));
@otakustay
otakustay / index.js
Created Mar 10, 2021
Compute aspect ratio
View index.js
const isApproximateInteger = value => {
const min = Math.floor(value);
const max = Math.ceil(value);
return value - min <= 0.01 || max - value <= 0.01;
};
const MAX_TRY = 120;
const computeToRatio = (width, height) => {
@otakustay
otakustay / useSelection.ts
Created Feb 22, 2020
React hook to control table selection
View useSelection.ts
import {useReducer, useCallback} from 'react';
import {union, without, difference, range} from 'lodash';
interface Action {
type: 'single' | 'multiple' | 'range';
payload: number;
}
export interface SelectionMethods {
selectIndex(index: number, e: ClickContext): void;
@otakustay
otakustay / index.tsx
Created Nov 7, 2019
usePerformanceTiming
View index.tsx
import {useRef, useLayoutEffect} from 'react';
interface PerformanceTiming {
firstRender: number;
firstLayout: number;
firstMeaningfulRender: number;
firstMeaningfulLayout: number;
}
const usePerformanceRecord = () => {
@otakustay
otakustay / index.ts
Created Oct 24, 2019
user attention detection
View index.ts
interface Options {
readonly maxIdleTime?: number;
}
type AttentionState = 'active' | 'inactive' | 'unknown';
interface AttentionChangeEvent {
readonly state: AttentionState;
readonly active: boolean;
readonly lastAction: number;
View unidiff.js
"use strict";
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
!function (e, n) {
"object" == (typeof exports === "undefined" ? "undefined" : _typeof(exports)) && "undefined" != typeof module ? n(exports) : "function" == typeof define && define.amd ? define(["exports"], n) : n(e.unidiff = {});
}(void 0, function (e) {
"use strict";
function n(e) {
@otakustay
otakustay / rollup.js
Created May 20, 2019
svg icon rollup
View rollup.js
const {rollup} = require('rollup');
const babel = require('rollup-plugin-babel');
const svgToReact = require('rollup-plugin-svg-to-jsx');
const autoExternal = require('rollup-plugin-auto-external');
const resolve = require('rollup-plugin-node-resolve');
const css = require('rollup-plugin-postcss');
const babelConfig = {
presets: [
[
@otakustay
otakustay / quick-start.md
Created Mar 25, 2019
reskript quick start
View quick-start.md

首先建立一个新的目录,并使用yarn init进行初始化:

mkdir hello-world
yarn init -y

然后安装reskript

@otakustay
otakustay / upgrade.js
Created Mar 15, 2019
Upgrade to reskript
View upgrade.js
const path = require('path');
const fs = require('fs');
const {execSync} = require('child_process');
const {sync: rimraf} = require('rimraf');
const {sync: glob} = require('glob');
const {mapValues} = require('lodash');
const topLevelModuleNames = glob('src/*/').map(path => path.slice(4, -1));
const replaceImportAlias = content => topLevelModuleNames.reduce(
@otakustay
otakustay / hoc.jsx
Last active Feb 4, 2021
Convert HOC to Hook
View hoc.jsx
// HOC版本
const withDelayHint = (loadingPropName, delay) => ComponentIn => class extends Component {
state = {
timer: null,
isDelayed: false
};
tryStartTimer = () => {
clearTimeout(this.state.timer);