web 2.0, frontend, ajax, flash, css, dhtml, php

When iPhone came out for the first time, I was amazed at how iPhone rotated safari web browser. I wondered how iPhone would rotate it and was not aware that not all iPhone applications are rotatable, but now I know how.

Let’s assume that we already have your own extended UIViewController class. UIViewController class has these two classes for the rotate feature:

1
2
3
4
5
6
7

-(BOOL)shouldAutorotateToInterfaceOrientation:
	(UIInterfaceOrientation)interfaceOrientation {
}
-(void)willRotateToInterfaceOrientation:
	(UIInterfaceOrientation)orientation
		duration:(NSTimeInterval)duration {
}

shouldAutorotateToInterfaceOrientation method. You simply just return “YES” so that the viewcontroller rotate its views automatically. The 2nd method “willRotateToInterfaceOrientation” is the one you want to implement.

Let’s say you already had one UIView object with white color background. When you rotated your iPhone or iPhone simulator to landscape orientation, the UIView would be rotated. However, the view wouldn’t fit the screen. To make the view to stretch to the all 4 edges of the screen, I would write something like this:

1
2
3
4
5
6
7
8
9
10
11
12
13

-(void)willRotateToInterfaceOrientation:
	(UIInterfaceOrientation)orientation
		duration:(NSTimeInterval)duration {
	CGRect appFrame;
	appFrame.origin = CGPointMake(0.0f, 0.0f);
	if ((orientation == UIInterfaceOrientationLandscapeLeft) ||
			(orientation == UIInterfaceOrientationLandscapeRight))
		appFrame.size = CGSizeMake(480.0f, 300.0f);
	else
		appFrame.size = CGSizeMake(320.0f, 460.0f);
 
	[contentView setFrame:appFrame];
}

As you can see, every time view gets rotated, you would need to use setFrame method to set the new frame with a new size and new origin.

Today I had to put a lot of files into cvs repository. First I repeated *cvs add blah blah* so many times and then after I wanted to find a way to add files to cvs easily. Here’s what I found out:

(actually i was adding .as files)

find ./ -name "*.as" -exec cvs add {} \;

That was just cvs but with “find”, I could remove a bunch of files too!

find ./ -name "*._ymv*" -exec rm {} \;
find ./ -name "*.DS_Store" -exec rm {} \;

This study shows performance issues of native javascript APIs on multiple browsers.
I think this is definitely a good read for all DOMers who work closely with client scripts.

I just want to point out couple things.

1. innerHTML vs. appendChild(dom)
I use innerHTML when I do not need to get a reference back for later use from the operation or generate many HTML elements. When I need to manipulate the HTML element that is created through DOM object, I usually cache the object to a global variable or a object’s property. Also when many elements need to get appended to a DIV tag or something else, innerHTML gives faster performance over appendChild method. If you look at the tv.yahoo.com/listings_setup page, channel rows are created through innerHTML and it’s quite quickly rendered even if there are over 500 rows. If I injected more than 500 rows using appendChild way, it would have been very slow and eventually locked up a browser for a bit during the process.

2. Let’s not focus on numbers too much.
It’s good to know the detail number of each process. However, even if one process took 30 or 100 milli seconds, it would have not been noticed by a regular user. If one tasks got involved with multiple procedures and ended up taking up 1-2 seconds, I’d call it “design problem”, not a performance problem. With DHTML manipulation and Ajax, possible things you can do with them seem endless, but you do not want to push the line too hard. Especially in ajax application, design/architecture matters more than API/scripting.

3. Learn the limit.
Knowing the limit is very important. There are limits in any scripting languages. The role as a developer/engineer is to play around the limit and still produce a nice product for users. Of course, there will be requirements from product people that may hit the limit and cause performance issue, but as a developer/engineer you should put your efforts to change the requirements or be creative to do workaround on the limit.

Again, the numbers on the report give a real nice overview of what API to use and not.

Check this link out!

There are very well known Javascript debugging tools for firefox. Those are fiebug and webdev. In fact, without those tools, javascript development would be *alert()* debugging after all.

I used MS visual studio for past 5 years and it had a great Javascript debugging tool for IE. (Last I remember, MS visual studio 2005 had a Javascript debugging tool, which can be used for IE as well as firefox.) Somehow I happened to go to this page today. This page shows three ways to debug Javascript on IE.