Skip to content

Instantly share code, notes, and snippets.

Avatar

uolcano uolcano

View GitHub Profile
@uolcano
uolcano / what-forces-layout.md
Created Apr 4, 2017 — forked from paulirish/what-forces-layout.md
What forces layout/reflow. The comprehensive list.
View what-forces-layout.md

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.

Element

Box metrics
  • elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent
  • elem.clientLeft, elem.clientTop, elem.clientWidth, elem.clientHeight
  • elem.getClientRects(), elem.getBoundingClientRect()
View My Tips To Use GitHub.md

收集GitHub使用技巧

快捷键Shortcut

Shortcut Description Shortcut Description
Site wide shortcuts ———— Commit list ————
s Focus search bar y Expand URL to its canonical form
g n Go to Notifications Dashboards ————
g d Go to Dashboard g i Go to your issues
? Bring up this help dialog g p Go to your pull requests
@uolcano
uolcano / 0.Advanced Tricks on JavaScript.md
Last active May 8, 2018
Advanced Tricks on JavaScript
View 0.Advanced Tricks on JavaScript.md
@uolcano
uolcano / 0_reuse_code.js
Created Mar 12, 2017
Here are some things you can do with Gists in GistBox.
View 0_reuse_code.js
// Use Gists to store code you would like to remember later on
console.log(window); // log the "window" object to the console
@uolcano
uolcano / performanceOptimization.js
Last active Aug 25, 2016
Some performance optimization
View performanceOptimization.js
function isArray (arg) {
return Object.prototype.toString.call(arg).slice(8, -1) === 'Array';
}
/**
* [chunk Array chunk iteration]
* @param { array } arr [array to iterate]
* @param {function} fn [function to process array]
* @param {integer } intv [iteration interval milliseconds]
* @param {function} success [function for async invocation when iteration complete]
* @param { object } ctx [context to invoke the function]
@uolcano
uolcano / typeof.js
Last active Aug 25, 2016
get the accurate type of certain data by native JavaScript
View typeof.js
var _create = Object.create,
_slice = Array.prototype.slice,
_toString = Object.prototype.toString,
_hasOwn = Object.prototype.hasOwnProperty;
/**
* [getTypeOf Get the data type of some data]
* @param {any type} arg [the data to get type]
* @return { string } [the string to describe the data type]
*
* usage:
@uolcano
uolcano / EventWrap&MultiEventWrap.js
Created Aug 16, 2016
An object(s) event wrapper method, compatible with IE8+
View EventWrap&MultiEventWrap.js
! function() {
if (typeof Array.prototype.forEach != 'function') {
Array.prototype.forEach = function(fn) {
var arr = Object(this),
i = 0,
len = 0;
if (Object.prototype.toString.call(arr).slice(8, -1) != 'Array') {
console.log('Error: Array.prototype.indexOf - the caller must be an array!');
return;
}
@uolcano
uolcano / cookies.js
Created Aug 5, 2016
Some cookie method set
View cookies.js
var uTools = {};
/*****************
The cookie method set
*****************/
! function ($) {
$.cookies = {
get: function (name) {
var cookies = document.cookie,
name = encodeURIComponent(name) + '=',
start = cookies.indexOf(name),
@uolcano
uolcano / uTools.js
Last active Aug 6, 2016
Some scripts
View uTools.js
var uTools = {};
/************************************
Compatible solution for native methods
************************************/
! function () {
'use strict';
if (typeof Object.create != 'function') {
Object.create = function () {
var Temp = function () {};
return function (proto) {