Brit Gardner britg

This post is also on my blog, since Gist doesn't support @ notifications.

Components are taking center stage in Ember 2.0. Here are some things you can do today to make the transition as smooth as possible:

Use Ember CLI
In general, replace views + controllers with components
Only use controllers at the top-level for receiving data from the route, and use Ember.Controller instead of Ember.ArrayController or Ember.ObjectController
Fetch data in your route, and set it as normal properties on your top-level controller. Export an Ember.Controller, otherwise a proxy will be generated. You can use Ember.RSVP.hash to simulate setting normal props on your controller.

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

	namespace :deploy do
	namespace :assets do
	task :precompile, :roles => :web, :except => { :no_release => true } do
	assets_path = File.join(release_path, "public/assets")
	assets_empty = capture("ls -x #{assets_path}").length == 0

	has_current_release = capture("if [ -d #{current_path} ]; then echo -n \"yes\"; fi") == "yes"

	compile_assets = false

	# RSpec CanCan matcher.
	#
	# When testing your user must have an id otherwise a nil foreign key will
	# match on new records.
	#
	# Examples
	#
	# describe User do
	# subject { User.create! }
	#

	import UIKit

	extension UIColor {
	convenience init(hex: String, alpha: CGFloat = 1) {
	assert(hex[hex.startIndex] == "#", "Expected hex string of format #RRGGBB")

	let scanner = NSScanner(string: hex)
	scanner.scanLocation = 1 // skip #

	var rgb: UInt32 = 0