Skip to content

Instantly share code, notes, and snippets.

View fuweichin's full-sized avatar

Fuwei Chin fuweichin

6 followers · 2 following
  • Yongzhou
View GitHub Profile
@fuweichin
fuweichin / index.html
Created December 2, 2022 11:39
setInterval implementations
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>setInterval implementations</title>
</head>
<body>
<div>
@fuweichin
fuweichin / index.html
Last active August 13, 2026 03:49
Power Saving Mode detection
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Power Saving Mode detection</title>
</head>
<body>
<div>Power Saving Mode? <code id="powerSavingMode"></code></div>
<script type="module">
@fuweichin
fuweichin / index.html
Created July 28, 2022 05:52
Enable transition when entering/leaving blackscreen or whitescreen
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
.container{
width: 1280px;
margin: 0 auto;
@fuweichin
fuweichin / foobar-experimental.js
Created June 25, 2022 01:21
Chrome 103: import-maps doesn't work with modulepreload
import foo from 'foo';
import bar from 'bar';
console.log(foo, bar);
@fuweichin
fuweichin / index.html
Created June 21, 2022 18:20
Collect and show uncaught script error and unhandled promise rejection
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Script Error Repoter</title>
</head>
<body>
<h1>Script Error Repoter</h1>
<button id="raiseError">Raise an error</button>
@fuweichin
fuweichin / index.html
Created June 16, 2022 20:12
Get nearest color of wave length in sRGB, Display P3, Rec. 2020 or CIE 1931 XYZ
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Wave Length to Color Example</title>
<style>
body, p{
margin: 0;
}
@fuweichin
fuweichin / index.html
Last active June 13, 2022 18:29
screen.orienation polyfill and ponyfill, for Safari
<h2>screen.orientation</h2>
<p id="msg">&#160;</p>
<pre><code id="output">...</code></pre>
<script type="module">
import {ponyfill, polyfill} from './screen-orientation.js';
const $ = (s, c = document) => c.querySelector(s);
@fuweichin
fuweichin / LICENSE
Last active September 14, 2026 17:35
User Agent Client Hints API (navigator.userAgentData) polyfill and ponyfill
Copyright (c) 2026 Fuwei Chin
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
@fuweichin
fuweichin / animation-utils.js
Created June 12, 2022 16:43
animate with specific frame rate (fps), based on requestAnimationFrame instead of setInterval/setTimeout
function filterNums(nums, jitter = 0.2, downJitter = 1 - 1 / (1 + jitter)) {
let len = nums.length;
let mid = Math.floor(len % 2 === 0 ? len / 2 : (len - 1) / 2), low = mid, high = mid;
let lower = true, higher = true;
let sum = nums[mid], count = 1;
for (let i = 1, j, num; i <= mid; i += 1) {
if (higher) {
j = mid + i;
if (j === len)
break;
@fuweichin
fuweichin / index.html
Last active July 1, 2022 21:02
given a template literal and a scope object, return resolved string
<!-- to resolve synchronously -->
<script src="resolve-template.js"></script>
<!-- to resolve asynchronously -->
<script>
let worker = new Worker('resolve-template.js');
let idGen = (function* () {
for (let i = 0; true; i = (i + 1) >> 0) {
yield i;
}