Skip to content

Instantly share code, notes, and snippets.

View perjerz's full-sized avatar
🏠
Working from home

Siwat Kaolueng perjerz

🏠
Working from home
70 followers · 377 following
View GitHub Profile
@perjerz
perjerz / gist:da0964ba180dc5c680a59fb6656f6f3a
Created November 27, 2022 09:21 — forked from noamr/gist:c9efc56220820d5dd716eb6f64c11146
const TMDB_IMAGE_BASE_URL = 'https://image.tmdb.org/t/p/';
addEventListener("fetch", e => {
const url = new URL(e.request.url);
if (url.pathname === "/image") {
e.respondWith((async () => {
const width = url.searchParams.get("width");
const path = url.searchParams.get("path");
try {
return await fetch(`${TMDB_IMAGE_BASE_URL}/w${width}${path}`, {mode: "no-cors"});
@perjerz
perjerz / data-table.component.html
Created November 27, 2022 05:38 — forked from pjlamb12/data-table.component.html
Angular Data Table Component
<content-section
[csTitle]="title"
[collapsible]="collapsible"
[state]="state"
[locked]="locked"
[noButtons]="noButtons"
[buttons]="_buttons"
>
<!-- Custom controls -->
<ng-content></ng-content>
@perjerz
perjerz / README.md
Created September 14, 2022 05:38 — forked from peerreynders/README.md
µsignal 0.4.0 performance comparison

Sample run on Ubuntu 22.04 LTS [i7-4900MQ CPU @ 2.80GHz/32GB] Chromium 105.0.5195.102

Solid (solid.html)

Created 205760 nodes.
  1 ms; sum: 4.55651722365801e+305
278 ms; sum: 9.11303444731602e+305

@preact/signals (preactive.html)

@perjerz
perjerz / canvas color picker.html
Created August 9, 2022 10:19 — forked from lovasoa/canvas color picker.html
JS color picker: HTML5 & javascript color picker that uses HTML5 canvas. User can choose hue and value, saturation is set to 1. It has color history management.
<!doctype html>
<html>
<head>
<meta charset="utf8" />
<title>Canvascolor</title>
<style>
body {
background-image:url(http://github.com/favicon.ico); /*Just for fun*/
}
main {
@perjerz
perjerz / esm-package.md
Created February 16, 2022 09:51 — forked from sindresorhus/esm-package.md
Pure ESM package

Pure ESM package

The package linked to from here is now pure ESM. It cannot be require()'d from CommonJS.

This means you have the following choices:

  1. Use ESM yourself. (preferred)
    Use import foo from 'foo' instead of const foo = require('foo') to import the package. You also need to put "type": "module" in your package.json and more. Follow the below guide.
  2. If the package is used in an async context, you could use await import(…) from CommonJS instead of require(…).
  3. Stay on the existing version of the package until you can move to ESM.
@perjerz
perjerz / index.html
Created January 30, 2022 09:33 — forked from acoshift/index.html
<!doctype html>
<html lang=en>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/ethers.umd.min.js" defer></script>
<script src="https://cdn.jsdelivr.net/npm/@metamask/[email protected]/dist/detect-provider.min.js" defer></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/cdn.min.js" defer></script>
<script>
window.abi = {
'IERC20': [
{
@perjerz
perjerz / dom_performance_reflow_repaint.md
Created July 21, 2021 10:18 — forked from faressoft/dom_performance_reflow_repaint.md
DOM Performance (Reflow & Repaint) (Summary)

DOM Performance

Rendering

  • How the browser renders the document
    • Receives the data (bytes) from the server.
    • Parses and converts into tokens (<, TagName, Attribute, AttributeValue, >).
    • Turns tokens into nodes.
    • Turns nodes into the DOM tree.
  • Builds CSSOM tree from the css rules.
@perjerz
perjerz / types.ts
Created January 18, 2021 14:26 — forked from ClickerMonkey/types.ts
Typescript Helper Types
// when T is any|unknown, Y is returned, otherwise N
type IsAnyUnknown<T, Y, N> = unknown extends T ? Y : N;
// when T is never, Y is returned, otherwise N
type IsNever<T, Y = true, N = false> = [T] extends [never] ? Y : N;
// when T is a tuple, Y is returned, otherwise N
// valid tuples = [string], [string, boolean],
// invalid tuples = [], string[], (string | number)[]
@perjerz
perjerz / simple-stack-machine-in-type-system.ts
Last active November 29, 2020 03:57 — forked from RReverser/simple-stack-machine-in-type-system.ts
// Playground link: https://www.typescriptlang.org/play?#code/PTAEHEEsGcBdQG4FMBO1IHsB2AuUALWWAB2hxAHMZYA6K2fAVwCMaBjDAW2ACUelkaVMABMAZgCMbMQDYAHAFZFAQwAmCkWwAMSACwB2VXJHN98hQu1IFAWABQ92AE9iSUAFEAHkjYAeAMJcnMpYqtAANKAAyrDKsG4AvKAA3qBwymwA1ngA2gC6kQA2GGzKhWQpAL6glQB8oAn2oKCBnMGh0KBInvEdoDmQWABmqC1BIaqRNNODIyig-HB5TaAA-B7efouwkV4+re2qvjFxSJEHE7W1K3gn8QDc9o4ubgDygiiQqki+r8wAVpEAHLKThnUAANTKjCQ9SSILBXR6SD6cE+WAoaxSKxyAGlQINQAAKTJIJwYIagP7-ACUoAAPqAEUg8nh8d1emEmaC3OsoYUYaA8NS8aAAGTE0nkynUmnLOzVPBYASoR4OOzOVwQJCwfkw34A4E8uHcxEclFcqUUqkArEi5l5IWgZWCNXPLUAFUYxEKPyBSM5nSwjE4zFQkR4AYtnRCTnyDX6eRNPByAHJfRiGKnHea+v71pG8F6fX7IjlY1Npjwk267IN4ighhk3ECkBQgSGwyhfABBZidXNc4Oh1D1VLKihxSDIPB9zqVd0ttu+D0mj1RvNtjsj7uzUZz+rrOdO9eDoOd0brVvti-d1dOl2qp4al6gOcrtcbrnX7dd3x7+Y53vI9+3XIsv3PHcsTA50VRQWtNTcHtiB9JwokgCgsBXSIAAUMAHZE+mYDAMF9EITTwgjA1AWAUEFdYYOvD8ENfcAdXQzCPwTU9CO-Ldb18Ycu0PUAm3KNw8FomEWK1ABZRhCg4rCe0iAAhE0chU0BVJzXjOhyKTwUMx1GRyMToHBcyWSxQynSsmS3CiENf1QXsIOdW81PcoTRwTHJphoYtfV7WpK0C71gvUvI0wzCgs0dCUfPg59EOiFggp+Ht3NjfIvLPUAcq
@perjerz
perjerz / with-loading.pipe.ts
Created November 9, 2020 06:33 — forked from alexzuza/with-loading.pipe.ts
With loading pipe long living stream
import { Pipe, PipeTransform } from '@angular/core';
import { isObservable, of } from 'rxjs';
import { map, startWith, catchError } from 'rxjs/operators';
@Pipe({
name: 'withLoading',
})
export class WithLoadingPipe implements PipeTransform {
transform(val) {
return isObservable(val)