vasanthk

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

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

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

let addTask,
    removeTask;

addTask = (data) => {
    return {
        type: 'ADD_TASK',
        data: data
    };
};

vasanthk

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

var foo = {
  doSomething: function(){
    // ...
  }
}

var bar = {};
bar.doSomething = foo.doSomething;

vasanthk

// Original method
var object = {
  method: function (x, y) {
    return x+y;
  }
}

// Add operations before or after!
object.method = (function (original) {
  return function (x, y) {

vasanthk

// 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

/**
 * 
 *  Dinesh
 * 
 *  RootedTreeTraversal
 *   - Preorder Traversal
 *   - Postorder Traversal
 *   - Inorder Traversal
 *   - Levelorder Traversal
 * 

vasanthk

    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)