ReEntrant Locks

thewantedpk — Fri, 01 May 2020 22:19:13 +0000

How many of you still need to use (for non-ownership lock release) or have a code base which uses semaphores (shorturl.at/fjzPW) ? At least, I have not seen a code base in last 8+ years with semaphores in it. Based on my discussion with few fresh dev interview candidates in the past , I thought it might be a good idea to share some light on the term reentrant locks. The word itself is self explanatory. A lock which can be entered again or acquired again. The only conditions is - "by the same thread". Can be better described with a code example

private Lock lock = new ReentrantLock(true);

private void lockMyselfWithoutDeadLock(int counter){
    if (counter <= 0){
        return;
    }
    lock.lock();
    System.out.println("Call Myself");
    lockMyselfWithoutDeadLock(counter-1);
    lock.unlock();
}

public static void main(String[] args){
    ReEntrantLock reEntrantLock = new ReEntrantLock();
    reEntrantLock.lockMyselfWithoutDeadLock(5);
}

Any thread which calls above method with a positive number and is able to acquire lock once, will be able to call itself, until returned and thus re-acquiring the lock multiple times.

TO explain a non-reentrant lock,I would use an example of Semaphore. Think of it like a ticketed entry point which can allow a certain number of permits. A thread which has a valid permit can use that permit once to enter. If a thread can get one more permit, it can enter the lock one more time. Main point is that there is a limit. Its not like re-entrant locks where same thread can gain the lock any number of times. Following example will showcase the scenario

   private Semaphore lock = new Semaphore(2); // 2 Permits

   private void lockMyselfWithDeadLock(int counter) throws 
                                        InterruptedException 
   {
     if (counter <= 0){
         return;
     }
     lock.acquire();
     System.out.println("Call Myself");
     lockMyselfWithDeadLock(counter-1);
     lock.release();
   }

   public static void main(String[] args) throws InterruptedException {
     NonReEntrantLock nonReEntrantLock = new NonReEntrantLock();
     nonReEntrantLock.lockMyselfWithDeadLock(5);
   }

The above program will be in a deadlock if called with an argument greater than 2 as semaphore holds only 2 permits. I hope this will help someone trying to learn concurrency !!

Beginners Guide to Redux App

thewantedpk — Mon, 07 Oct 2019 03:26:52 +0000

I am new to React and as of now only use it for my side projects. While learning React, there were plenty of tutorials on React as Beginner, still I had hard time understanding how all pieces together solve the puzzle. So I am writing this blog for someone like me, who is just looking to understand, how all the pieces go together in a redux based app. The application that we will create here is a non fancy application which puts a random number in the store with each click and toggles the state flag from empty to non-empty.

In any redux application, we need following pieces :

Store

This is an object that represents the main state of the application. Based on the application requirement, it can be a simple key-valued object or a very heavy nested object. In our case , we have a simple object with only two attributes :
• randomNums : An array of numbers
• isEmpty : A flag used to show if the above array is empty or not

    const defaultState = {
               randomNums : [],
               isEmpty : true
    };

Action

They are the medium through which an application interacts with the store. They are the payloads/objects transferring data from application to store. All actions are plain JavaScript objects with a mandatory attribute named ‘type’ which has string value describing the action to perform on the store.

    {
        type : 'REPLACE',     -----This is the action
        randomNum            ----- this is the actual payload
    }

ActionCreators

These are the functions returning action objects as defined in step 2. All action creators can be combined in a single file.

export function replace(randomNum){
    return {
        type : 'REPLACE',
        randomNum
    }
}

export function toggleFlag(){
    return {
        type : 'TOGGLE'
    }
}

Reducers

Reducers define how an application state changes, in response to the action being sent to the store. They use the action’s ‘type’ to determine its impact on the store. You can think of reducer taking an action and state as input and producing a new state.

const appendItem = (state=[],action) => {
    switch(action.type){
        case 'REPLACE':
            return {randomNums : [action.randomNum],
            isEmpty : false};
        case 'TOGGLE':
            return {randomNums : [],
            isEmpty : true};           
        default : 
            return state;
    }
}

export default appendItem;

Now the question is, how our components can access and modify state. What that means is , our components should be able to access the state and call the type of action (defined in actionCreators) as suitable. So to achieve that task, I will be overriding following two functions

mapStateToProps

This method maps the state to the application props. Return the object with only properties needed by the components.

    function mapStateToProps(state) {
            return {
               randomNums : state.randomNums,
               isEmpty : state.isEmpty
            }
        }

mapDispatchToProps

This method binds the dipatch function to the Props. Dispatch is the function of redux store which propagates an action and causes the state change. BindActionCreators binds the actions to be dispatched.

      function mapDispatchToProps(dispatch){
          return bindActionCreators(actionCreators,dispatch);
      }

react-redux module provides a connect function to bind dispatch and state to our component. As we can see below, it can take two arguments :
a.) mapStateToProps
b.) mapDispatchToProps

     export default connect(mapStateToProps,mapDispatchToProps)(Lister);

Lister Component

import React from 'react';
import createReactClass from 'create-react-class';
import App from '../App.css'


const Lister = createReactClass({
    render(){
       return (
            <div className="App">
                <button onClick={() => this.props.append(Math.random()*100)}>Append</button>
                <button onClick={() => this.props.toggleFlag()}>Clear</button>
                <p>The state is  : {this.props.isEmpty ? 'Empty':'Populated'}</p>
            {this.props.randomNums.map((randomNum,i)=> {
                return (
                    <div className='App' key={i}>
                        <p>
                            <strong>
                                {randomNum}
                            </strong>
                        </p>
                    </div>
                )
            })}           
        </div>
       )
    }
});

export default Lister;

Now lets create our store using the redux createStore function. Lets provide it with a default state and reducer which can actually change the state.

const defaultState = {
    randomNums : [],
    isEmpty : true
  };
  
const store = createStore(appender,defaultState);

Last piece to complete the application is to provide the store to the application. React-redux module provides the Provider tag which provides access of store to the application.

ReactDOM.render(
    <Provider store={store}>
        <App />
    </Provider>, document.getElementById('root'));

DEV Community: thewantedpk