Skip to content

Instantly share code, notes, and snippets.

Avatar

Vasa vasanthk

View GitHub Profile
@vasanthk
vasanthk / gist:5c10a9af4632ee4477c2
Created Nov 3, 2015 — forked from lttlrck/gist:9628955
rename git branch locally and remotely
View gist:5c10a9af4632ee4477c2
git branch -m old_branch new_branch # Rename branch locally
git push origin :old_branch # Delete the old branch
git push --set-upstream origin new_branch # Push the new branch, set local branch to track the new remote
@vasanthk
vasanthk / what-forces-layout.md
Created Nov 15, 2015 — 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()
@vasanthk
vasanthk / es7-class.md
Created Nov 18, 2015 — forked from ericelliott/es7-class.md
Let's fix `class` in ES7
View es7-class.md

Two Simple Changes to Simplify class

I'm not suggesting drastic action. I don't want to break backwards compatibility. I simply want to make the class feature more usable to a broader cross section of the community. I believe there is some low-hanging fruit that can be harvested to that end.

Imagine AutoMaker contained class Car, but the author wants to take advantage of prototypes to enable factory polymorphism in order to dynamically swap out implementation.

Stampit does something similar to this in order to supply information needed to inherit from composable factory functions, known as stamps.

This isn't the only way to achieve this, but it is a convenient way which is compatible with .call(), .apply(), and .bind().

@vasanthk
vasanthk / 1.js
Created Nov 18, 2015 — forked from gajus/1.js
Succinct declaration of redux actions
View 1.js
let addTask,
removeTask;
addTask = (data) => {
return {
type: 'ADD_TASK',
data: data
};
};
@vasanthk
vasanthk / 00 README.md
Created Nov 24, 2015 — forked from istarkov/00 README.md
How to style React components
View 00 README.md

How to style React components

If you use sass and css-modules and want to restyle some base component without changing its code. (base component already use css-modules and exposes styles property)

I know two way how to do it.

  1. Using composes css-modules operator. Just extend classes you need, then in javascript code combine both styles as {...baseStyle, ...myStyleSimple}
@vasanthk
vasanthk / 1.js
Created Nov 30, 2015 — forked from mxriverlynn/1.js
JavaScript mixins
View 1.js
var foo = {
doSomething: function(){
// ...
}
}
var bar = {};
bar.doSomething = foo.doSomething;
@vasanthk
vasanthk / monkey-patch.js
Created Dec 1, 2015 — forked from naholyr/monkey-patch.js
JS monkey patching
View monkey-patch.js
// Original method
var object = {
method: function (x, y) {
return x+y;
}
}
// Add operations before or after!
object.method = (function (original) {
return function (x, y) {
View generators-async.js
// Control the flow of asynchronous calls with ES6 generator functions
// http://chrisbuttery.com/articles/synchronous-asynchronous-javascript-with-es6-generators/
/**
* get - XHR Request
*/
let get = function (url) {
return function (callback) {
let xhr = new XMLHttpRequest();
@vasanthk
vasanthk / RootedTreeTraversal.js
Created Dec 16, 2015 — forked from dineshrajpurohit/RootedTreeTraversal.js
Preorder, Postorder,Inorder and Levelorder traversal of rooted trees using Javascript
View RootedTreeTraversal.js
/**
*
* Dinesh
*
* RootedTreeTraversal
* - Preorder Traversal
* - Postorder Traversal
* - Inorder Traversal
* - Levelorder Traversal
*
@vasanthk
vasanthk / gist:06680b52a0c6aae5d121
Created Dec 16, 2015 — forked from mcsheffrey/gist:6977999
Given an input array and another array that describes a new index for each element, mutate the input array so that each element ends up in their new index. Discuss the runtime of the algorithm and how you can be sure there won't be any infinite loops. Run time of this solution is THETA(n) as indexOf is a constant-time operation since an array in…
View gist:06680b52a0c6aae5d121
var input = [1,2,3,4,5],
specArr = [0,2,1,4,3];
function mutate(input, specArr) {
var visited = [0,2]
for(var i=0; i<specArr.length; i++) {
var tmp;
//keep track of array items we've already looped through (wouldn't want to mutate twice :D)