Skip to content

Instantly share code, notes, and snippets.

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

Junn socker210

🏠
Working from home
  • Seoul, Republic of Korea
View GitHub Profile
@socker210
socker210 / what-forces-layout.md
Created February 25, 2022 08:53 — forked from paulirish/what-forces-layout.md
What forces layout/reflow. The comprehensive list.

What forces layout / reflow

All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.

Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.

Element APIs

Getting box metrics
  • elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent

Problem

I have two Github accounts: oanhnn (personal) and superman (for work). I want to use both accounts on same computer (without typing password everytime, when doing git push or pull).

Solution

Use ssh keys and define host aliases in ssh config file (each alias for an account).

How to?

  1. Generate ssh key pairs for accounts and add them to GitHub accounts.
import React from 'react';
import type { Story, Meta } from '../storybook';
import { Button, ButtonProps } from './button';
export default {
title: 'React/Button',
component: Button,
argTypes: {
children: { name: 'label', control: 'text' },
},
@socker210
socker210 / rAF.js
Created October 9, 2020 14:45 — forked from paulirish/rAF.js
requestAnimationFrame polyfill
// http://paulirish.com/2011/requestanimationframe-for-smart-animating/
// http://my.opera.com/emoller/blog/2011/12/20/requestanimationframe-for-smart-er-animating
// requestAnimationFrame polyfill by Erik Möller. fixes from Paul Irish and Tino Zijdel
// MIT license
(function() {
var lastTime = 0;
var vendors = ['ms', 'moz', 'webkit', 'o'];
@socker210
socker210 / image-arraybuffer.js
Created June 24, 2020 10:43 — forked from harun/image-arraybuffer.js
Create a jpg image from ArrayBuffer data
// Simulate a call to Dropbox or other service that can
// return an image as an ArrayBuffer.
var xhr = new XMLHttpRequest();
// Use JSFiddle logo as a sample image to avoid complicating
// this example with cross-domain issues.
xhr.open( "GET", "http://fiddle.jshell.net/img/logo.png", true );
// Ask for the result as an ArrayBuffer.
xhr.responseType = "arraybuffer";
@socker210
socker210 / process.nextTick.js
Created June 22, 2020 10:47 — forked from WebReflection/process.nextTick.js
process.nextTick(callback) for browsers too
!function (window) {"use strict";
// by WebReflection - WTFPL License
var
prefixes = "r webkitR mozR msR oR".split(" "),
process = "process",
nextTick = "nextTick",
i = 0,
p = window[process] || (window[process] = {})
;
while (!p[nextTick] && i < prefixes.length)