Skip to content

Instantly share code, notes, and snippets.

View shqld's full-sized avatar
🦭
shqld

shqld

🦭
shqld
52 followers · 42 following
View GitHub Profile
@shqld
shqld / css-size-comparison.csv
Last active October 3, 2022 21:13 — forked from primaryobjects/css-comparison.csv
A comparison of CSS library sizes.
We can make this file beautiful and searchable if this error is corrected: Unclosed quoted field in line 8.
Caution,Name,Version,Size (raw),Size (minified),Size (gzipped),"Site","URL",Remarks
,Milligram,v1.4.1,11 kb,9.0 kb,2.3 kb,"https://milligram.io/","https://cdnjs.cloudflare.com/ajax/libs/milligram/1.4.1/milligram.min.css",
,Skelton,v2.0.4,11 kb,5.8 kb,1.6 kb,"http://getskeleton.com/","https://cdnjs.cloudflare.com/ajax/libs/skeleton/2.0.4/skeleton.min.css",
,Material Design Lite,v1.3.0,146 kb,62 kb,12 kb,"https://getmdl.io/","https://code.getmdl.io/1.3.0/material.min.js",
,Foundation,v6.6.3,168 kb,133 kb,17 kb,"https://get.foundation/","https://cdn.jsdelivr.net/npm/foundation-sites@6.6.3/dist/css/foundation.min.css",
,Materialize,v1.0.0,179 kb,141 kb,21 kb,"https://materializecss.com/","https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css",
,Bootstrap,v4.6.0,199 kb,161 kb,24 kb,"https://getbootstrap.com/docs/4.6/","https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css",
,Bootstrap,v5.1.2,206 kb,164 kb,24 kb,"https://getbootstrap.com/","https://cdn.jsdelivr.net/npm/b
@shqld
shqld / main.ts
Created July 12, 2021 08:26
Required / Optional prop definition by name
type RequiredPropName<T extends string> = `${T}!`
type OptionalPropName<T extends string> = `${T}?`
type QualifiedPropName<T extends string> = RequiredPropName<T> | OptionalPropName<T>
type RequiredProp<T> = {
value: T,
required: true
}
type OptionalProp<T> = {
@shqld
shqld / event_loop_race.ts
Last active April 13, 2021 14:10
Event Loop Race
race()
function race() {
let count = 1
function finish(message) {
console.log(`${count++}. ${message}`)
}
setTimeout(() => finish('timeout'), 0)
@shqld
shqld / friendly-inifinite-loop.js
Created April 1, 2020 00:55
A bit friendly infinite loop
const run = () => console.log("loop") || requestIdleCallback(run)
run()
@shqld
shqld / async-operations-server.js
Last active November 29, 2019 19:18
Async handling for sync operations on server-side, leveraging EventLoop
const express = require('express')
const sleep = (ms) => new Promise((res, rej) => setTimeout(res, ms))
const sleepSync = (ms) => {
const start = new Date()
while (new Date() - start < ms) {}
}
const server = express()
@shqld
shqld / get-v8-optimization-status.js
Created September 23, 2019 16:13
Get V8 optimization status
// https://github.com/v8/v8/blob/master/test/mjsunit/mjsunit.js#L162-L178
const statuses = {
IsFunction: 1 << 0,
NeverOptimize: 1 << 1,
AlwaysOptimize: 1 << 2,
MaybeDeopted: 1 << 3,
Optimized: 1 << 4,
TurboFanned: 1 << 5,
Interpreted: 1 << 6,
@shqld
shqld / Terser & Babel の好きなところ.md
Last active December 20, 2023 15:27
個人的にTerser & Babelの好きなところ

だれ？

(credit: @tomo_e さん)

  • 新卒 2 年目
  • ウェブチーム
@shqld
shqld / colored_console.ts
Last active August 19, 2019 07:29
Colored console with chalk
import chalk from 'chalk';
export const initChalk = ({ error = chalk.redBright, warn = chalk.yellowBright } = {}) => {
// disable coloring e.g. when piped like `2> err.log`
if (typeof process !== 'undefined' && !process.stderr.isTTY) {
return;
}
if (error) {
const defaultError = console.error.bind(console);
@shqld
shqld / useStore.tsx
Last active May 5, 2019 13:44
`useStore` hook for reading global state without binding actions
import { useState, useEffect } from 'preact/hooks'
// or
import { useState, useEffect } from 'react'
import { Store } from 'unistore'
// or
import { Store } from 'redux'
const extract = (state: any, key: any) => {
if (!key) return state
@shqld
shqld / my-lazyloader.html
Created April 27, 2019 06:58
A toy LazyLoader built with WebComponents/CustomElement
<style>
.container {
display: flex;
flex-direction: row;
height: 1000px;
}
.item {
flex: 1;
}
</style>