Skip to content

Instantly share code, notes, and snippets.

@hail2u
hail2u / png-vs-lossless-avif.md
Last active March 18, 2023 00:45
PNGから可逆AVIFに変換した時に、どれくらいファイルサイズが変化するか

463ファイルでファイルサイズが増え(AVIFの方が大きい)、154ファイルで減った。7割以上の確率で増えてしまう。

filename width height PNG size AVIF size ratio
11px_sized_text.png 192px 172px 3.572KB 5.873KB 1.644
404-sign.png 440px 440px 6.092KB 13.303KB 2.184
480-gridder.png 480px 191px 0.268KB 1.183KB 4.414
6-lines-of-p-and-9-lines-of-pre.png 784px 240px 22.043KB 58.122KB 2.637
700_subscribers.png 480px 250px 17.204KB 24.702KB 1.436
a-massive-influx-of-flat-sites.png 480px 270px 2.203KB 8.943KB 4.059
{
"env": {
"es6": true,
"node": true
},
"globals": {
"AbortController": true,
"fetch": true,
"FormData": true
},
@hail2u
hail2u / apca.js
Last active September 11, 2023 05:18
Get contrast of colors using APCA (Advanced Perceptual Contrast Algorithm)
// https://github.com/Myndex/SAPC-APCA#the-plain-english-steps-are
// Example:
// const contrast = getAPCAContrast("rgb(255, 255, 255)", "rgb(136, 136, 136)");
// This returns `66.89346308821438` (66.893%)
// SAPC-APCA README says:
// > #888 vs #fff • 66.89346308821438
// 80% means 7:1 in WCAG 2.0
// 60% means 4.5:1 in WCAG 2.0
@hail2u
hail2u / open
Created October 9, 2020 10:33
WSL用openコマンド
#!/bin/sh
wslview $(wslpath -w "$1")
@hail2u
hail2u / index.js
Last active July 12, 2020 10:25
Hail2uの雑記記事をソースにランダムなアルファベットや数字がちょくちょく混ざる日本語のテキスト・データを作るスクリプト
// node index.js --count=5 --format=html --type=paragraph
// --count: 1-32 (default; 5)
// --format: html, txt (default)
// --type: list, paragraph (default)
import fs from "fs";
import minimist from "minimist";
const select = (data) => data[Math.floor(Math.random() * data.length)];
  • foo
    • bar
      • baz
        • qux
          • quux
            • quuz
              • corge
                • grault
                  • garply
  • waldo
const to8Chunks = (previous, current, index) => {
const remainder = index % 8;
if (!previous[remainder]) {
previous.push([]);
}
previous[remainder].push(current);
return previous;
};
@hail2u
hail2u / inline-css.js
Last active May 8, 2020 06:05
HTMLファイルを渡すと、参照しているCSSファイルを読み、必要なルールだけインライン化するやつ
// $ node inline-css.js <path-to-html-file>
import fs from "fs/promises";
import jsdom from "jsdom";
import postcss from "postcss";
const { JSDOM } = jsdom;
const hasNode = (document, selector) => {
if (selector.includes(":")) {
@hail2u
hail2u / list-unused-custom-properties.js
Created August 29, 2019 05:31
List unused custom properties
// list unused custom properties
// $ node list-unused-custom-properties.js <FILENAME>
const fs = require("fs");
const postcss = require("postcss");
const css = postcss.parse(fs.readFileSync(process.argv[2], "utf8"));
const customProperties = {};
css.walkDecls(decl => {
if (decl.prop.startsWith("--")) {
@hail2u
hail2u / data.json
Last active August 27, 2019 10:23
mustache.js v3.0.2 and partial indentation
{}