Vedran vedran314

Starving the Event Loop with microtasks

Sparked from this twitter conversation when talking about doing fast async rendering of declarative UIs in Preact

These examples show how it's possible to starve the main event loop with microtasks (because the microtask queue is emptied at the end of every item in the event loop queue). Note that these are contrived examples, but can be reflective of situations where Promises are incorrectly expected to yield to the event loop "because they're async".

setTimeout-only.js is there to form a baseline

Regular Event Loop

This shows the execution order given JavaScript's Call Stack, Event Loop, and any asynchronous APIs provided in the JS execution environment (in this example; Web APIs in a Browser environment)

Given the code

Use these rapid keyboard shortcuts to control the GitHub Atom text editor on macOS.

Key to the Keys

⌘ : Command key
⌃ : Control key
⌫ : Delete key
← : Left arrow key
→ : Right arrow key
↑ : Up arrow key

Mac web developer apps

This gist's comment stream is a collection of webdev apps for OS X. Feel free to add links to apps you like, just make sure you add some context to what it does — either from the creator's website or your own thoughts.

— Erik

Multiple SSH Keys settings for different github account

create different public key

create different ssh key according the article Mac Set-Up Git

$ ssh-keygen -t rsa -C "your_email@youremail.com"

Susy Tutorial

For this tutorial I'm assuming you are already comfortable with CSS, Sass (I'll use the SCSS syntax) and Compass. Please get set up with each one of those before attempting to use Susy. Sass and Compass both have their own setup instructions and tutorials that you can use.

There is also reference documentation in the works.

What Susy Does

CSS Systems

	"use strict";

	// Load plugins
	const autoprefixer = require("autoprefixer");
	const browsersync = require("browser-sync").create();
	const cp = require("child_process");
	const cssnano = require("cssnano");
	const del = require("del");
	const eslint = require("gulp-eslint");
	const gulp = require("gulp");

	sass/
	\|
	\|– base/
	\| \|– _reset.scss # Reset/normalize
	\| \|– _typography.scss # Typography rules
	\| ... # Etc…
	\|
	\|– components/
	\| \|– _buttons.scss # Buttons
	\| \|– _carousel.scss # Carousel

	var BatchStream = require('batch-stream2')
	var gulp = require('gulp')
	var coffee = require('gulp-coffee')
	var uglify = require('gulp-uglify')
	var cssmin = require('gulp-minify-css')
	var bower = require('gulp-bower-files')
	var stylus = require('gulp-stylus')
	var livereload = require('gulp-livereload')
	var include = require('gulp-include')
	var concat = require('gulp-concat')

	@mixin ie6 { * html & { @content } }

	#logo {
	background-image: url("/images/logo.png");
	@include ie6 { background-image: url("/images/logo.gif"); }
	}