Simulation to visualize event loop

README.md

Purpose

This is a little in-terminal ⚠️simulation⚠️ of blocking I/O + threads vs. non-blocking I/O + event loop. The purpose is to illustrate the different execution times visually.

Please remember it's a simulation and take it with a grain of salt. 😄

Install

1. clone this gist: git clone https://gist.github.com/Sequoia/94d192908e05f7674423 eventloop-simulation
2. cd eventloop-simulation
3. npm i

Usage

1. node .
2. Control+C to quit

One possible way to talk thru this would be to comment out all but the first run function & just do blocking, then uncomment the second and run again, ditto the third.

License

CC-BY-NC-SA-4.0. If you'd like more of this or other work, drop me a line!

• sequoia (twitter)

index.js

var async = require('async');
var columns = require('columns').create();
var shuffle = require('lodash').shuffle;
var chalk = require('chalk');

//hack to keep process running; enter ^c to quit
process.stdin.resume();

//"tasks" with various completion times (time on CPU)
var tasks = [ 1, 1, 1, 1, 50, 50, 50, 50, 50, 50, 50, 50, 50, 50, 50, 200, 200,
  200, 200, 200, 200, 200, 200, 1000, 1000, 1000, 1000, 1000, 2000, 2000, 2000,
  2000, 2000, 2000, 5000, 5000 ];

tasks = shuffle(tasks);

//functions to run different types of SIMULATIONS
var runBlocking = makeColumn('eachSeries', 'Blocking, 1 thread', 'red', tasks);
var numThreads = 5;
var runThreaded = makeColumn('eachLimit', 'Blocking, '+numThreads+' threads', 'blue', tasks, numThreads);
var runEventLoop= makeColumn('each', 'EventLoop (async i/o)', 'green', tasks);

//kick off the tasks, 3 ways
//start by just running the first then uncomment each next one
runBlocking();
runThreaded();
runEventLoop();

function makeColumn(asyncMethod, label, color, tasks, additionalAsyncArgs){
  //return "run" function
  return function run(){
    var column = columns.addColumn(label);
    var startTime = Date.now();

    //build args for async
    var args = [tasks];
    if(additionalAsyncArgs){
      args = args.concat(additionalAsyncArgs);
    }
    args = args.concat(function eachFn(ms, next){
      setTimeout(function(){
        column.write(chalk[color]('Completed task: ' + ms + 'ms\n'));
        next();
      }, ms);
    });
    args = args.concat(function finishedFn(){
      var endTime = Date.now() - startTime;
      column.write(chalk.bold.underline[color]('ALL DONE IN ' + endTime + 'ms')+'\n');
    });

    async[asyncMethod].apply(async, args);
  };
}

package.json

{
  "name": "eventloop-illustration",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "Sequoia McDowell <sequoia.mcdowell@gmail.com> (http://sequoia.makes.software/)",
  "license": "CC-BY-NC-SA-4.0",
  "dependencies": {
    "async": "^1.5.2",
    "chalk": "^1.1.1",
    "columns": "^0.8.0",
    "lodash": "^3.10.1"
  }
}