Alexander Kasheverov kashesandr

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.

Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.

Element APIs

Getting box metrics

elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent

Stylus Best Practices

Introduction

This is a curated set of conventions and best practices for Stylus, an expressive, dynamic, robust and advanced CSS preprocessor. Frustrated with there not being a set of conventions set in place (that could be easily found), I set forth to find out on my own.

	// Simple proxy/forwarding server for when you don't want to have to add CORS during development.

	// Usage: node proxy.js
	// Open browser and navigate to http://localhost:9100/[url]
	// Example: http://localhost:9100/http://www.google.com

	// This is NOT for anything outside local development. It has zero error handling among other glaring problems.

	// This started as code I grabbed from this SO question: http://stackoverflow.com/a/13472952/670023

	// Q sample by Jeff Cogswell

	/*===========
	We want to call these three functions in sequence, one after the other:

	First we want to call one, which initiates an ajax call. Once that
	ajax call is complete, we want to call two. Once two's ajax call is
	complete, we want to call three.

	BUT, we don't want to just call our three functions in sequence, as this quick

	// NOTE: I previously suggested doing this through Grunt, but had plenty of problems with
	// my set up. Grunt did some weird things with scope, and I ended up using nodemon. This
	// setup is now using Gulp. It works exactly how I expect it to and is WAY more concise.
	var gulp = require('gulp'),
	spawn = require('child_process').spawn,
	node;

	/**
	* $ gulp server
	* description: launch the server. If there's a server already running, kill it.

	// Source: https://groups.google.com/forum/#!topic/angular/hVrkvaHGOfc
	// jsFiddle: http://jsfiddle.net/pkozlowski_opensource/PxdSP/14/
	// author: Pawel Kozlowski

	var myApp = angular.module('myApp', []);

	//service style, probably the simplest one
	myApp.service('helloWorldFromService', function() {
	this.sayHello = function() {
	return "Hello, World!"