Skip to content

Instantly share code, notes, and snippets.

View xxjinwei's full-sized avatar
💻
Working...

Celile Fulwood xxjinwei

💻
Working...
View GitHub Profile
@xxjinwei
xxjinwei / cancelable-promise.js
Last active May 6, 2019 08:05
cancelable promise
/**
* @file cancelable promise
*/
const pending = Promise.race.bind(Promise, []);
export default function cancellablePromise(fn) {
let isPending = true;
const patch = fn => (...args) => {
isPending = false;
if (fn) {
fn(...args);
@xxjinwei
xxjinwei / chrome.sh
Created April 11, 2019 08:21
google bot + private
#!/usr/bin/env bash
cd /Applications/Google\ Chrome.app/Contents/MacOS
UA='Mozilla/5.0 (compatible; Googlebot/2.1; +http://www.google.com/bot.html)'
./Google\ Chrome --user-agent="$UA" --incognito
@xxjinwei
xxjinwei / kmp.js
Last active October 30, 2018 13:15
const getNext = str => {
let len = str.length;
let next = [-1];
let i = 0;
let p = -1;
while (i < len) {
if (p === -1 || str[i] === str[p]) {
next[++i] = ++p;
} else {
@xxjinwei
xxjinwei / Article.md
Created November 2, 2017 12:10 — forked from Warry/Article.md
How to make faster scroll effects?

How to make faster scroll effects?

  • Avoid too many reflows (the browser to recalculate everything)
  • Use advanced CSS3 for graphic card rendering
  • Precalculate sizes and positions

Beware of reflows

The reflow appens as many times as there are frames per seconds. It recalculate all positions that change in order to diplay them. Basically, when you scroll you execute a function where you move things between two reflows. But there are functions that triggers reflows such as jQuery offset, scroll... So there are two things to take care about when you dynamically change objects in javascript to avoid too many reflows:

@xxjinwei
xxjinwei / index.html
Last active August 28, 2017 10:17
equel height colum by flex
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<style id="jsbin-css">
.con {
display: flex;
flex-wrap: wrap;
@xxjinwei
xxjinwei / get-keyboard-height.js
Created May 10, 2017 12:55
get keyboard height
import { Keyboard, Dimensions } from 'react'
let KEYBOARD_HEIGHT = 0
Keyboard.addListener('keyboardDidChangeFrame', function ({ endCoordinates }) {
KEYBOARD_HEIGHT = DIMENSION.height - endCoordinates.screenY
})
@xxjinwei
xxjinwei / react-unknown-prop.md
Created May 9, 2017 03:46 — forked from jimfb/react-unknown-prop.md

The unknown-prop warning will fire if you attempt to render a DOM element with a prop that is not recognized by React as a legal DOM attribute/property. You should ensure that your DOM elements do not have spurious props floating around.

There are a couple of likely reasons this warning could be appearing:

  1. Are you using {...this.props} or cloneElement(element, this.props)? Your component is transferring its own props directly to a child element (eg. https://facebook.github.io/react/docs/transferring-props.html). When transferring props to a child component, you should ensure that you are not accidentally forwarding props that were intended to be interpreted by the parent component.

  2. You are using a non-standard DOM attribute on a native DOM node, perhaps to represent custom data. If you are trying to attach custom data to a standard DOM element, consider using a custom data attribute (https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Using_data_attributes).

  3. React does not yet reco

@xxjinwei
xxjinwei / CSS media queries
Created March 1, 2017 15:54 — forked from ticking-clock/CSS media queries
Common media queries with LESS
@media only screen and (max-width: 767px) {
}
@media only screen and (min-width: 768px) {
}
@media only screen and (min-width: 992px) {
}
@media only screen and (min-width: 1200px) {
@xxjinwei
xxjinwei / gist:6d22d01a81d169078b48
Last active September 7, 2015 10:23 — forked from karl0-dev/gist:b887874d32b0d560014f
CSS media queries 2015
/* Smartphones (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px) {
/* STYLES GO HERE */
}
/* Smartphones (landscape) ----------- */
@media only screen
@xxjinwei
xxjinwei / index.html
Last active August 29, 2015 14:28 — forked from anonymous/index.html
fixed center and middle // source http://jsbin.com/lepane
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>fixed center and middle</title>
<style id="jsbin-css">
div {
position: fixed;
width: 200px;
height: 200px;