mokhan.ca

layoffs

2013-05-29T20:36:00-06:00

Today 5 people from my office were laid off. Another 2 people were laid off about a month ago. That's 7 layoffs in the 4 months that I have been here.

This was the first time that I had worked somewhere where more then one person was let go at a time. I have been fortunate in my career to never have seen layoffs before. This shook me up a bit.

I remember being a kid when my dad was laid off. It was not a fun time for him or the rest of us in the family. He never really got back into the same field of work, but I know he tried. I remember the look of shame on his face when he took the job at Zellers trying to get people to sign up for a Zellers card. Everyday he came home in his Zellers uniform he just look defeated. From that point on I believe he started living in the past. He would say things like "I should have taken a computer class instead of another geophysics class" or "I should have never sold that house" and "I should have done...". You get the drift.

I think while my dad was in his prime he would never have guessed that someday his skillset would no longer be needed. I think that hurt him.

Living in the past, makes it very difficult to live in the now.

Whether you are a full time employee, contractor, business owner, self employed or whatever you are not guaranteed work.

Today was a rude awakening for me. I, like my dad, started drifting into the past. Unlike my dad, I am choosing to live in the now and look forward to what the future may bring.

ios day three

2013-05-14T17:51:00-06:00

MVC (Model View Controller)

Model means data.
View means view or screen.
Controller means controller.

Every view has a controller, but not every controller has a view. Some special controllers, that we call controller of controllers are used in Xcode.

Connecting a view to a controller

Do some drag and drop stuff. Ctrl+click and drag UI elements to the code editor (this seems like a good idea... sarcasm intended).

IBOutlet is a keyword that allows teh view to see the code and connect to it.

IBAction has the same value as void. It is a keyword that allows the button to see the code and connect to it.

-(IBAction)firstButton:(id)sender {
}

Simulator Rotation

If you press Command+left or Command+right it will rotate the simulator. You can turn this off by unchecking "Use Autolayout" in the File Inspector for the .xib file.

The view wont rotate when the phone is upside down. Apple doesn't want you to be playing a game or using an app with the phone upside down.

Collections

Objective-C has several different types of collections.

Arrays
Sets
Dictionaries

Collections can only contain references to objects.

NSArray

is immutable, which means it must be completely populated when it's instantiated.

  NSArray * items = [[NSArray alloc] initWithObjects:@"ruby", @"c", @"c#", nil];

nil terminal is necessary. That is how the array will know what size it will be.

To store an integer into an array:

  NSArray * numbers = [[NSArray alloc] initWithObjects:[NSNumber
  numberWithInt:5]];
  [[numbers objectAtIndex:0] intValue];

NSMutableArray

Is mutable, so you can push objects into it or pop object off of it.

Controls

Controls are how we input data into our application, and view the data from our app.

Labels

The view is always controlled by the ViewController. It is the file owner.

Buttons

Touch Up Inside: When you touch the button and lift your finger off the button. Basically a click event.

44 - Magic Number

44x44 is the minimum area for when someone is tapping something.

cprg-190 day two

2013-05-09T18:30:00-06:00

Starting with arithmetic expressions but I already read that last class.

Everything inherits from NSObject.

Person.m

Define the implementation of the Person class.

#import "Person.h"

@implementation Person

@end

Person.h

Define the interface for Person.

#import "Person.h"

@interface Person : NSObject

@end

strong vs weak references

Strong reference is like a dog on a leash. The dog wants to run a way. strong is like the leash. As long as the pointer is strong then the dog can't run away. With a weak reference the dog can run away.

method invocation

Instead of calling it invoking a method or calling a function it is described as "sending a message".

To invoke a class method.

  [Person new]

To invoke an instance method.

  Person * person = [Person new];
  [person sayHi]

Documentation for NSObject#new

new Allocates a new instance of the receiving class, sends it an init message, and returns the initialized object.

(id)new Return Value A new instance of the receiver.

Discussion This method is a combination of alloc and init. Like alloc, it initializes the isa instance variable of the new object so it points to the class data structure. It then invokes the init method to complete the initialization process.

You will never see people use "new". Instead they use alloc and init.

  
  Person * person = [[Person alloc] init];

Properties

To get and set you can send messages to the object. To set a property you need to prefix the message with "set".

  
  Person * person = [Person new];
  [person setFirstName:@"Mo"];
  NSLog(@"%@", [person firstName]);

dot syntax

  
  Person * person = [Person new];
  person.firstName = "Mo";
  NSLog(@"%@", person.firstName);

Named Parameters

  
@interface Person : NSObject
-(void) name:(NSString *)theName age:(int)theAge;
@end

@implementation Person

-(void) name:(NSString *)theName age:(int)theAge
{
}

@end

Person * person = [Person new];
[person name:@"blah" age:2]

cprg-190 day one

2013-05-08T09:22:00-06:00

instructor: kris hopkins kris.hopkins@sait.ca

Acronym soup: * OTA (over the air) download.

xcodeproj - This is the xcode project.

Why is there NS in front of log? Objective C was created by the company NeXT. NeXT first introduced their object-oriented operating system, called NeXTSTEP, in the late 80s. Many of the classes you will see in Objective-C still have NS in front of them as a reference to Next Step.

Why is there a symbol @ in front of the string we are logging? Objective-C is a strict superset of C. This means you can compile any C code in an Objective-C project. In Objective-C we never use C Strings, we always use object oriented strings, called NSStrings. The @ symbol is a heads up to the compiler that what is coming next is an Objective-C NSString and not a C string.

Objective-C Primitive Data Types

There are 5 primitive datatypes in Objective-C:

int - integer
float - floating point number
double - double precision floating point number
char - a single character
BOOL - YES or NO

Everything else is a Class data type.

Objective-C Variables

variables are used to identify a value.
variables are always strongly typed.
every variable must be one data type only and must be declared.

  int myInt;
  myInt = 5;
  int myInt = 5;

Format Specifiers

%d - int
%f - float, double
%c - char
%@ - any object e.g NSString
Note that when outputting the value for a BOOL data type use %d to get the int value. 0 for NO and 1 for YES

NSString

All objects use pointser. A pointer is a variable that holds a reference to an address in memory instead of an actual value. The address in memory holds the actual value that has been assigned.

  NSString * myString = @"Hello";

  NSLog(@"What the what? %@", myString);

Arithmetic Operators

"+" Add
"-" Subtract
"*" Multiply
"/" divide
"%" remainder (modulus)
"=" assignment
"+=" add R to L, then assign to L
"-=" subtract R from L, then assign to L
"*=" multiply L by R, then assign to L
"/=" divide R into L, then assign result to L
"%=" L mod B, then assign to L
"++" add 1
"--" subtract

Relational Operators

Work same way they do in other C-based languages.

"==" equal to
"!=" not equal to
"<" less than
"<=" less than or equal to
">" greater than
">=" greater than or equal to

Logical Operators

All logical operators work exactly the same way they do in other C-based languages:

"&&" and
"||" or
"!" not

Custom classes

NSObject is the top level class and parent class of all other classes in Objective-C.

Objective-C classes contain two files. The first is the interface file, identified by the .h suffix. This can also be called the "header" file (h = header). The second is the implementation file, identified by a .m suffix.

The interface file contains a declaration of the elements of a class that other classes can see. The implementation file contains all the actual content for the class.

All of the declarations inside an interface file are contains within the @interface and @end keywords.

All of the content inside an implementation file is contained within the @implementation and @end keywords.

Interface

1   #import <Foundation/Foundation.h>
2   @interface Person : NSObject
3   @end

Preprocessor statement. Imports the Foundation framework so we have access to the build Objective-C classes such as NSObject.
Shows that this is an interface for Person.
Closes the interface section of the file.

Implementation

1 #import "Person.h"
2 @implementation Person
3 @end

Import our header file so our implementation file can see it.
begin implementation section of the file, and states the name of the classes.
close the implementation.

@property keyword tells the compiler that we want to create a property. strong and nonatomic keywords have to do with memory management and we'll talk about them later.

  Person * newPerson = [Person new];

Create a new instance of Person. This is like new Person() in other languages. Instead of "calling a method" we are "sending a message".

Sending the new message to the Person class will work, but you'll rarely see it this way. It is much more common to see the instantiation of the object like this:

  Person * newPerson = [[Person alloc] init];

This breaks the new message into two parts. First we allocate memory for our object (alloc), then we initialize it by calling the object's initialization message (init).

Many objective c classes have many different init messages that do different things and pass in different arguments.

  NSString * newString = [[NSString alloc] initWithFormat:@"%@", @"my text"];

Here is how you set and get our firstName property:

  [newPerson setFirstName:@"Mo"];
  newPerson.firstName = @"Mo";
  [newPerson firstName]
  newPerson.firstName;

Methods (Messages)

  -(void) doSomething
  {
  }

  -(void) doSomething:(NSString *)firstThing
  {
  }

(+) class method
(-) instance method
(void) return type
A colon is required if there is at least one argument.
The data type must be stated.
We assign a name to each argument.

If you want to be able to call your method from other classes, we need to declare it in our interface (header) file:

Public and Private

Any property declared in the .h file is public. To make it private, put it in an @interface block above the @implementation block in the .m file, like this:

  @interface Person()
  @property (strong, nonatomic) NSString * myPrivateString;
  @end

Any method declared in the .h file is public. To make a method private, simple do not declare it in the .h file.

Strong/Weak References

A strong reference to an object is one where the memory is reserved (and the object stays alive) until we don't need it any more. This is the default.

A weak reference to an object is one where the memory is reserved only until all other strong pointers stop pointing to it strongly.

We will almost always use a strong reference.

CORS

2013-05-07T15:49:00-06:00

Cross-Origin Resource Sharing is a way for web applications that are hosted at one domain to access resources hosted in a different domain.

For example:

If http://blah.com/ wants to use a webfont that is served up through http://blah.cloudfront.net then an Access-Control-Allow-Origin header needs to be returned with the resource with a value of http://blah.com/. If not, Firefox will not load the web font. Chrome and Safari don't seem to care. This is actually trickier than it sounds.

On a site we have been working on recently, we host our pre-compiled assets as well as any digital uploads in an AWS S3 bucket. We use CloudFront with a distribution that points to that bucket to distribute the static asssets. In order to get the proper Access-Control-Allow-Origin header to be returned you must setup some CORS rules on your S3 bucket.

CORS Configuration

Log in to the AWS console.
Navigate to the S3 dashboard.
Choose your S3 bucket.
Click on Properties.
Choose the Permissions section.
Click on "Edit CORS Configuration"
Enter the following rules.

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
  <CORSRule>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
    <MaxAgeSeconds>3000</MaxAgeSeconds>
    <AllowedHeader>Content-*</AllowedHeader>
    <AllowedHeader>Host</AllowedHeader>
  </CORSRule>
</CORSConfiguration>

The AWS documentation suggests that you can upload a "cors" file to the root of your bucket to configure rules, but I could not get this to work.

You can test your configuration using curl.

$ curl -i -H "Origin: https://blah.com" -svk -o /dev/null https://blah.cloudfront.net/assets/font.eot

If it works you in the response you should see:

  Access-Control-Allow-Origin: http://blah.com

But it's not over. If the first request to the cloudfront resource is for an http request then cloudfront will cache the response header as http. If the next request is for the same resource using https, then you will get the same cached http header back. This will cause Firefox to not load your webfont.

If you choose to hit your s3 bucket directly this is not an issue as headers are not cached. I have found that serving the font using https directly from the s3 bucket seems to be the easiest solution so far.

cloudfront

2013-05-01T09:46:00-06:00

CloudFront is a web service that speeds up distribution of your content. It delivers that content through a worldwide network of servers. When someone requests conten from CloudFront they are routed to the closed edge server to them to retrieve the content.

The number of networks and the distance that the request has to travel will have a significant impact on the performance, reliability, and availability of the asset.

Origin Servers

An origin server is the location where you store the original content.
This can be an EC2 instance, an S3 bucket or your own http server.

CloudFront will serve cached copies of your assets when available on the edge server. Otherwise for the first request to an edge server CloudFront will make a request to your origin server to cache the asset.

Amazon CloudFront helps improve performance of your website by:

cache static content at edge locations. this means (css, js, images) are served by the location closest to the server to reduce latency and improve performance.
proxies requests for dynamic content back to your origin running in an AWS region.

You can use a CloudFront to deliver your entire website, including both static and dynamic content. You can control multiple origin servers and caching properties for different urls on your webiste.

Good choice for when you want to distribute updates or other downloadable software to end users. It also offers lower prices than Amazon S3 at higher usage tiers.

This is a great option for delivering media files. Lower data transfer prices and higher data transfer speeds.

Streaming media: Using Real Time Messaging Protocol (RTMP) you can stream from assets stored in S3 buckets.
Progressive download: You can drop media into S3 then configure cloudfront for progressive download.
live events: sounds like you can deliver live streaming stuff.

Distribution

After choosing your origin server you can create a distribution. A distribution tells cloudfront where your files are. cloudfront will give you a unique domain name that you can use to reference your files.

E.g. if your origin is an S3 bucket http://mybucket.s3.amazonaws.com/images/image.jpg you would change your links to point to http://mybucket.cloudfront.net/images/image.jpg

You can also configure a CNAME so that you can serve the assets right from your own domain.

There are 2 types of distributions:

Download distribution: deliver content via http or https.
Streaming distribution: delivers content via RTMP.

Expiration

File expire after being in an edge location for 24 hours. After expiration, the next request for that content will be forwarded to your origin.

Steps

Choose origin server.
Create a distribution.
Update your site to point asset urls to the cloudfront domain.
ship it?

CloudFront vs Amazon S3

S3 is designed for long term durable storage. CloudFront is designed to distribute your popular content with low latency. It is not durable. CloudFront can be a more cost-effective way to deliver popular assets to end users.

load averages

2013-04-30T13:39:00-06:00

load averages are the 3 numbers shown with the "uptime" and "top" commands.

load averages: 1.51 1.30 1.24

run-queue-length: the sum of the number of processes that are currently running plus the number that are waiting (queued) to run.

You want your CPU load to stay below 1.00. You are ok if you get some temporary spikes above 1.00. When you are consistently above 1.00, you need to worry.

Many sysadmins will draw a line at 0.70.

Rules for a single core.

0.70: time to investigate before things get worse.
1.00: fix it now, or you will be up in the middle of the night.
5.00: you are in serious trouble.

The load is relative to the number of processor cores available. 100% utilization mark is 1.00 on a single core, 2.00 on a dual-core, 4.00 on a quad core, etc.

Rules of Thumb

number of cores = max load
cores is cores. two quad-cores == four dual-cores == eight single-cores.

  $ uptime
  load averages: 1.51 1.30 1.24

load averages: [average over last minute] [average over last 5 minutes] [average over last 15 minutes]

Focus on the 15 minute average.

  $ cat /proc/cpuinfo
  $ grep 'model name' cat /proc/cpuinfo | wc -l

helpful links

scout app

heroku performance conversation

2013-04-30T13:18:00-06:00

Earlier this morning I got a chance to sit in on a phone conversation with an engineer from Heroku. The topic of discussion was on how we can improve performance for fairgoods.com. These are some of the notes from that conversation.

Memory usage reports from new relic is not very useful.
look up log runtime metrics from the heroku dev center.
- gives visibility into load and memory usage for running dynos.
goal is to keep reponse times to below 500mS.
find the optimal number of unicorn workers per dyno. without constraining resources. (3 seems to be the magic number for us.)
lookup a plugin called manual deploy to do rolling restarts. this allows you to restart workers one at a time instead of all at once.
load average below 4s is ok or else you might need to tweak the number of unicorn workers.
heroku currently offers 2X dynos that have approximately double the memory available.
- we were suggested to A/B test 1X vs 2X dynos to see if that would make a difference for us.
we had no H12 errors which indicate the number of request timeouts.
suggested unicorn timeout is 15 seconds, we are currently at 30 seconds.
- if your requests need to take longer than that then we should consider partitioning different parts of the application.
- one place that seems to have larger request times is when running reports.
break out the admin section of the site into its own application. You can configure different applications to connect to the same database by configuring environment variables. This move slow processing on the admin side to separate dynos than from the dynos that would serve the main website.
you can also scale up the dynos when interacting with the admin section.
in our case we could increase the unicorn worker count.
move image assets to cloudfront. serving images and static content through heroku is not ideal. we should see a performance increase if we can do this.

example proc file

  web: bundle exec unicorn -p $PORT -c ./config/unicorn.rb
  worker:  bundle exec rake jobs:work

viewport

2013-04-23T09:48:00-06:00

viewport

Viewport is an effective screen size for a mobile device. Use a special meta tag in the html header to tell mobile devices how many pixels to fit into its screen. Each device defaults to a default setting. Width should be equal to or slightly larger than your web content to ensure a little bit of margin next to your text for readability.

  <meta name="viewport" content="width=1024">

You can also set the viewport width to the same as the mobile devices native screen resolution.

  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">

Initial scale tells iphones and ipads not to scale to its default 980 px. Maximum scale previews users from zooming in.

css media queries

Conditional statements for CSS which you can use to target specific devices. You can point to different stylesheets depending on the media type and screen size. Or you can use conditional statements embedded in css to target media types and screen size.

  @media handheld, screen and (max-device-with: 480px) {
    body { width: 100% }
  }
  @media screen and (min-width: 481px) and (max-width: 1024px) {
    body { width: 100%; }
  }
  @media screen and (min-width: 1025px) {
    body { width: 100%; }
  }
  @media print {
    body { width: 100%; }
  }

This builds css to target mobile phones, tablets and computers.

helpful links

web design for mobile

rails caching

2013-04-11T12:28:00-06:00

Options

HTTP Caching: Uses HTTP headers to instruct browsers on server side caching.
Page Caching: Cache the entire page to disk and serve directly from the web server like Nginx.
Action Caching: Runs through the rails pipeline and runs before_filters but returns cached results from disk like page caching.
Fragment Caching: Store parts of views in the cache.
Rails.cache: In memory server side cache.

Page Caching

class ProductsController < ActionController caches_page :index

def index

@products = Products.all

end end

/products will generate a file called products.html.gz. NGINX will efficiently serve this static file
by default pages are cached in /public

To expire a page you call expire_page in the action that would invalidate the cache.

class ProductsController < ActionController caches_page :index

def index

@products = Products.all

end

def create

expire_page :action => :index

end end

Nginx can serve compressed content directly from disk by enabled gzip_static

  location / {
    gzip_static on;
  }

Page caching ignores parameters like /products?page=1. If someone requests /products?page=2 they will get the cached first page. A workaround is to use a route like /products/page/1

Action Caching

This is good for pages that restrict access in some way. Incoming request does go from webserver to rails stack. Before filters are run to allow for things like authentication. Instead of expire_page you use expire_action.

class ProductsController < ActionController
  before_filter :authenticate
  caches_action :index

  def index
    @products = Product.all
  end

  def create
    expire_action :action => :index
  end
end

Fragment Caching

Add cache "key" to your view to cache a fragment. You can use the updated_at timestamp to signal when to invalidate the cache.

<%= cache "post-#{@post.id}", @post.updated_at.to_i do %>
  <h1><%= @post.title %></h1>
  <p><%= @post.content %></p>
<% end %>

If you touch a post it will update the timestamp.

  Post.find(2).touch

  class Comment < ActiveRecord::Base
    belongs_to :post, :touch => true
  end

Rails Cache

  Rails.cache.write('foo', 'bar')
  Rails.cache.read('foo')
  Rails.cache.clear