It is very important to define which operating systems and on which browsers the application should be tested. Once you define the browsers on which the system should work, make sure you check all functionality on all browsers. If there is not enough time/budget, you can check the design and the main functionalities of the site with all browsers. Most of the cosmetic problems generally appear in Internet Explorer 6.0. We like to use IETester (http://www.my-debugbar.com/wiki/IETester/HomePage), the application supports all Internet Explorer versions.

For comparing the design of a site on different browsers, there is one tool named Adobe BrowserLab that works great. With it you can compare a web page in one browser next to a page in another browser or overlay the pages entirely. The tool supports the following browsers:

• Chrome 3.0 – Windows
• Firefox 2.0 – OS X
• Firefox 2.0 – windows
• Firefox 3.0 – OS X
• Firefox 3.0 – Windows
• Firefox 3.6 – OS X
• Firefox 3.6 – Windows
• Internet Explorer 6.0
• Internet Explorer 7.0
• Internet Explorer 8.0
• Safari 3.0 – OS. X
• Safari 4.0 – OS X

Make sure that your bug reports are easy to understand

The best testers have the most bug reports resolved. A good bug report is one that assists in resolving an issue. Ensure that your bug reports can easily be reproduced by making them as clear and concise as possible. Here are several steps that you can follow:

1. Reproducibility – inform the developers how often the bug appears

2. Severity – inform the developers of the scale of the bug.

3. Summary – summarize the bug with one sentence – as a title for your report. Be descriptive and concise.

4. Bug Description – this is the most important section.

Be sure to include:

• Location of bug in the software
• URL (if you are testing web pages)
• Testing browsers or environment
• Information about the bug – here you need to explain the input data you used and the sequence of steps you made to cause the bug. This point is quite important make sure that your instructions are clear and reproducible. Make sure that you use the same terminology as the developers.
• Screen shots with comments and explanations. Firefox has one wonderful Add-on “FireShot”, this Add-on can be found also for Internet Explorer.

These days, more and more people in the IT business work with clients or have coworkers that are not from their own country and who communicate in another language. No matter how well you learn to understand a language, there still can be misunderstandings that can lead to problems of all types. It helps to have a pre-planned method and agreed terminology to report bugs.

There must be bugs

Start to test with the idea that there should be bugs. There is not a system that does not have a few errors. This mindset will help you to be more focused on finding problems.

Test situations that should not be executed

Sometimes, due to a variety of reasons, users do not enter something as they are intended to, press buttons out of order, or otherwise misuse the software. It is important to try to account for these situations.
If you have a registration form to test, try doing things OTHER than fill out the form. It was built to accept data, so try not entering anything and pressing the button for registration, enter invalid data such as email that does not have the “@” symbol or very long zip code or name. Use boundary cases (inputs at or just beyond maximum and minimum limits) to attempt to receive errors. There are symbols that can break the database or break the request from the database if they are entered and saved in the system. Such examples are the percentage (%) symbol, inverted commas(“”), and two minuses (–) together.
If you have a combination of actions that need to be done one after another, change their sequence. Make sure that you have checked all situations that you can think of, according to the system you test.

Test real situations

The above tips should not turn the QA process into a highly critical and aggressive testing period. Do not test and report bugs for unrealistic situations. Make sure you have understood the specification for the application and do not tease the developers with unrealistic bugs.

Test like you are a regular user, a computer illiterate user.

Think about the users, question yourself. Is this system user friendly? Can you easily navigate the program? Is the text within the system clear and understandable? Are the error messages helpful? There are a lot of examples in your own personal life. Think about when you sit at home on your personal computer – which sites or programs do you prefer? Why? Which you do not like? Why? Usability is always the answer.

Keep written reports

Sometimes bugs are  shared verbally with the developers. This can work against you.  Make sure that you keep written documentation of all your discussions about issues or anything concerning a project.  The best practice is to have reports on every issue you find.  Sometimes when communicating bugs verbally, many testers complain that the developers take the credit for their work or that managers who calculate the productivity of a tester by the number of bugs he/she reports do not give full credit.

Work to become a Team

Communication with your team members is just as important as knowing good techniques for testing and is key for the successful achievement of a quality product. You need to be flexible. During your work you will meet junior developers that have never worked with testers or people who will disagree with your findings. Some developers just need to get used the fact that they have bugs in their programs. This is normal. You need to persuade them that a tester for a developer is not like a critic for an author. Help them understand that you are a team and you both want the same thing. Prove your statement with facts and knowledge of the system and specifications.

Gain new knowledge

Black box testing uses external descriptions of the software with no knowledge about the internal structure. If you want to become competitive and help further your career, you should take a peak at the source code and ask questions of the developers. For cosmetic issues, you can read and learn about HTML and CSS and report specific CSS styles/areas of a web page that need fixing. Some tools that can help are the Web Developer Toolbar and the Firefox Add-on, Firebug. Some knowledge about Databases also will be helpful, this way you can more clearly understand the processes in the system and the reasons why some bugs appear. With more knowledge of how the software works, you will speed up the developer’s work and make yourself more efficient in the process.

Approving a high quality product is a hard and complicated process. Learn from your mistakes and from the bugs you found. Keep good communication with your coworkers, defend your position in a positive manner, keep learning, and continue testing.

1) What are a few emerging link tactics that you’ve seen in the past 12 months providing tremendous value to sites/pages? Can you give a specific example or two?

I haven’t found any new link tactics in the past 12 months that provide tremendous value. All the great tactics that truly provide tremendous value have been around for a while.

2) The SEO industry has become so stingy with linking to quality content to the point that many people who used to share a lot of it simply don’t bother, as it is not worth the cost of doing so. Is this a trend which spreads? Are we canaries in the coal mine, or is this just an issue impacting the SEO niche because it is far too saturated? What can Google do to encourage organic linking on the WWW (outside of nepotism, hype, spin, misinformation & ego-baiting)?

We don’t like to look greedy, so we don’t perform the stingy acts on our company web site. However the reason we created SpyderMate initially was as a linkbait tool. So for SpyderMate we don’t freely post external links. We feel it’s justified there however because we are offering a free and very useful service to the community.

3) What are the criteria for the “perfect link”?

The perfect link has the following attributes:

a) High authority domain & page
b) Minimal amount of external links on same page
c) Web site is very relevant to yours
d) The anchor text matches a keyword you are battling for
e) It’s located within the obvious content section of the web page
f) obviously it’s not tagged rel=”nofollow”

4) How do you go about creating a link marketing plan that will A:) Get tangible search results in a 6 to 12 month period and B:) Create sustainability for the website you are creating the plan for (i.e. keeping the links clean and adding links with long term value)

Well first you find out what keywords they should be targeting. Then you go through all their competitors ranking  for the keyword phrases and scour all their backlinks. Once you make sure you got a link from every backlink they have possible then you move on. Next you target the more lower hanging fruit longtail keywords through your list of standard directories that you submit to. This helps re-enforce your short-tail keywords with long tail variation power. After this you go for the seriously powerful links. These are your premium directory listings, your serious linkbait web sites and your powerful friend’s web sites. These sites target the more generic short-tail keywords that help raise all your longtails associated around them. The maintain sustainability you consistently create great new content and linkbait to create a consistent flow of natural inbound, quality, relevant links.

5) If you could choose a link on a lower authority page that would provide a moderate amount of targeted traffic or a link on a higher authority page that would provide absolutely no traffic – all other attributes being equal – for ranking benefits on the site you’re developing links for, which would you choose and why?

This depends entirely on how relevant and how well converting the lower authority page would be. It also depends on current rankings, whether or not there is a keyword I could boost my rankings for that would beat the conversions coming directly from this link. So if i had a site with a low conversion rate that had a high payout I would go with the lower authority link. If I had a site with a high conversion rate and a lower average payout I’d go with the high authority link.

6) Do you feel that you can conserve pagerank or that it’s still worth the effort to sculpt your links, by limiting the number of links on a page, creating them with JavaScript, passing them through a blocked page or using nofollow?

I believe you can, but also don’t believe it’s worth the effort, especially on a site that you’re constantly updating. There are other tasks you can spend your valuable time on that provide more value to your web presence.

7) Please discuss what link deprecation is and what impact it may have on a link building campaign.

I believe link deprecation to be the result of poorly built links primarily. The only reason this should occur is due to the age of the links. Actually losing links only happens to links that were easily attained and therefore easily lost. The best links are very hard to come by and last the test of time.

8) Do you think search engines are trying to find a way to depend less on link popularity and more on other algorithmic/social media factors?

I believe they are, but I don’t think it plays much of a role currently. I also think basing searches on social media is not viable for many categories of web sites. The fact that social media sites like Facebook are social make your likes inherently based around your friend’s general interests as well as your own. Even though I’m heavily interested in SEO, it does not mean I’m going to bother liking SEO articles I find interesting left and right because I know it will annoy my friends. I want to share things that I know my friends will also be interested in. This is not a system that a true search engine can be built upon. A search engine can however leverage this information is done on the right level.

9) How much do you stress internal linking on your own or clients’ sites? Do you have a quick rule of thumb or strategy to maximize the effectiveness of internal links?

I’ve found that emphasizing your traffic generating pages through inbound links is critical. Using carefully placed inbound links to associate relevant topics and re-emphasize targeted anchor text is extremely helpful, especially for that highest level page in the link scheme. Enough said.

10) What’s a successful link development strategy many overlook or dismiss?

Linkbait. People tend to dismiss serious linkbait strategies because of the time/costs associated with them. They tend to think other efforts are easier, but nothing generates those truly unique, critical, powerful links like well done linkbait.

11)  What have you been most WRONG about over the course of your link building/SEO career?

I was most wrong about how effective thousands of links coming from the same authoritative web site, with different anchor text, coming from different pages, linking to different pages were at lifting my rankings. Domain diversity is absolutely crucial. I’ve learned that one great warrior is better than thousands of mediocre warriors.

Google opened the source code under an Apache License and now the Android SDK allows developers to write managed code in the Java language, controlling the device via Google-developed Java libraries. The SDK includes a comprehensive set of development tools, such as a debugger, libraries, a handset emulator, documentation, sample code and tutorials.

Applications that run in the background are supported in Android in contrast to iPhone. All of these facts stimulate me to research this interesting technology. I decided to make an application running in the background and receiving the GPS location. The main goal was to inform the user not to write or read text messages while he or she is driving.

It is pretty easy to develop an Android application, especially if you are using Eclipse. You can download the latest version of the Android SDK from the official site. There are a lot of tutorials explaining how to install and use the SDK in Eclipse, if you are a beginner you can take a look at the developer’s guide.

Utilizing the GPS Module

As you may know smartphones have a gps module which provides the current location. This feature is used in many applications. To implement it you have to modify the AndroidManifest.xml, this is the main configuration file.

<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />

With these permissions you tell to the application that the GPS module will be used and the application is given access to it.

The Activity Class

There is one very important class in an application’s overall lifecycle – the Activity class. It takes care of creating a window for you in which you can place your UI. But this activity is not enough to create a background process. It should be used in conjunction with another object from the ContextWrapper to achieve the behavior of an application component that runs in the background and doesn’t interact with the user. This functionality is given up by the Service class. Both the activity and the service should be declared in the android manifest file.

My idea is to create a main activity class and in the onCreate() method call the service. But when something is started, there needs to be a way to stop it. The best place to stop the service is in the onDestroy() method of the main activity. These two methods are overridden because the main activity has to extend the Activity.java class. They look like:

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);
    try {
        // setup and start MainService
        MainService.setMainActivity(this);
        Intent svc = new Intent(this, MainService.class);
        startService(svc);
    } catch (Exception e) {
    Log.e(">>>", "Problem creating the UI", e);
    }
}

@Override
protected void onDestroy() {
    super.onDestroy();
    // stop MainService
    Intent svc = new Intent(this, MainService.class);
    stopService(svc);
}

This is how the activity class looks. The service class will manipulate the GPS module data. It will get the location in a time interval, get the speed or calculate it if it is not available and finally if the speed is more than 10km/h it will inform the user not to use the phone’s features while driving in order to avoid accidents.

The Service Class

As the main activity extends Activity.java class, the service should extend the Service.java class. The service is started in the overridden method onCreate() of the class.

// service business logic
private void startService() {
    TimerTask timerTask = new TimerTask(){
        public void run() {
            getUpdateLocation();
        }
    };
    timer.scheduleAtFixedRate(timerTask,0,UPDATE_TIME_INTERVAL);
    Log.i(getClass().getSimpleName(), "Timer started!");
}

First a timer object is needed which will take care of calling the service. To schedule the timer you have to prepare a TimerTask instance, which calls your business logic. In the example it is called the getUpdateLocation() method, its functionality will be explained later in this post. The timer is scheduled with the timer task and the specified time interval passed as a constant.

Lets take a look at the getUpdateLocation() method. As the title says, the method gets the location from the LocationManager.java class. The locations are separated by providers, so they are filtered with a criteria. Some GPS providers send the speed of the device. But if the speed is not received, it can easily be calculated as a quotient of the distance between the current and previous location with the subtraction of the two times.

private void getUpdateLocation() {
    Log.i(getClass().getSimpleName(), "background task - start");
    // get the system location service
    locationManager = (LocationManager)
                               getSystemService(Context.LOCATION_SERVICE);
    // create criteria to filter the providers
    Criteria criteria = new Criteria();
    bestProvider = locationManager.getBestProvider(criteria, false);
    Location location = locationManager.getLastKnownLocation(bestProvider);

    date = new Date();
    if(currentLocation == null){
        currentLocation = locationManager.getLastKnownLocation(bestProvider);
        currentDate = new Date();
    }

    float speed = calculateSpeed(location);
    // speed > (10km/h = 2.78m/s)
    if(speed > SPEED_LEVEL){
        Looper.prepare();
        Context context = getApplicationContext();
        CharSequence text = MESSAGE;
        int duration = Toast.LENGTH_LONG;
        Toast toast = Toast.makeText(context, text, duration);
        toast.show();
        Looper.loop();
    }
    // set the currentLocation and currentDate with new values
    // for the next iteration
    currentLocation = location;
    currentDate = date;
    Log.i(getClass().getSimpleName(), "background task - end");
}

The user will be informed with a warning message, if the calculated speed is more than a specified value. This is the business logic, but there is one other thing to take care of – the timer. The timer is started in the onCreate() method of the service class. It will be stopped in the onDestroy() method of the service class. The cancel() method will then be called in order to cancel the timer and remove any scheduled tasks.

if (timer != null) {
    timer.cancel();
}

The completed application will run in the background and inform the user with a message that his or her speed is more than 2.78 meters per second.

1. Place scripts near closing body tag

Scripts block parallel downloads. While a script is downloading, the browser will wait until it finishes before downloading anything else. This is why it is recommended that you get everything else out of the way before having your users download scripts.

2. Remove any broken links/references

Simply enter your web page URL in Pingdom’s Full Page Test Tool. This tool will color-code any broken links/references in red so you can easily identify them.

3. Specify image dimensions

When image dimensions are not specified in the HTML and/or CSS of a web page, the web server must spend resources calculating these dimensions. It’s particularly important to specify the dimensions of images being used in conjunction with heavy Javascript image-manipulation libraries.

4. Localize external file references to minimize DNS requests

This is another spot in which Pingdom’s Full Page Test Tool comes in handy. Enter your URL and look for any file references to external domains. If possible, copy these files onto your own domain and link to them locally to minimize DNS requests.

5. Minimize slow-loading libraries and external widgets

Libraries and external widgets need to be chosen carefully. Sometimes it’s worth sacrificing load time for particularly engaging/useful libraries and/or widgets; however, sometimes you can live without the library and/or widget. For example, on MentorMate.com we felt it was worth sacrificing Sexybuttons for better load time, but sacrificing load time for Shadowbox. External widgets can be particularly bad for a site’s load time because of their reliance on external servers.

6. Compress your files using gzip

These days, gzip comes pre-installed on most web servers. You can check to see if gzip is running your server quite easily using Google’s Firebug “Speed Test” extension. Open Firefox, visit the web site you’d like to optimize, and open Firebug. From there, click “Analyze Performance” and select the “Resources” tab. Then you can expand any file to view details. If gzip is installed and compressing the element you are viewing, you will see what is highlighted in red in the following screenshot:

7. Merge Javascript and CSS files or use Minify

Depending on the complexity of your site, it can be quite time consuming to merge all CSS into one file. The same goes for Javascript. This is why Minify was developed.  Minify “combines multiple CSS or Javascript files, removes unnecessary whitespace and comments, and serves them with gzip encoding and optimal client-side cache headers.” Then you simply need to install it on your site, select the files you want it to serve together, change some references in your header, and you’re good to go. This will minimize your site’s load time by further helping to reduce HTTP requests.

8. Load cross-browser compatibility hacks only for necessary browsers

For instance, we use the IE PNG FIX for IE6 PNG transparency compatibility. This script adds an extra second to web site load time. For this reason, we only load the script if the visitor is running IE6 by applying an IE6-specific stylesheet which references the IE PNG FIX. This way the extra load time will only impact IE6 visitors.

We simply added the following line of code to our header:

<!--[if IE 6]><link rel="stylesheet" type="text/css" href="css/ie6.css" /><![endif]-->

9. Use CSS sprites to minimize HTTP Requests

A CSS sprite is the combination of multiple images into one. Then CSS is used to reference different aspects of the image where needed. This reduces load time by minimizing all of these images into only one  HTTP request. CSS Tricks has a good example of CSS sprites.

Supported chart types include:

• X-Y charts (line, spline and scatter);
• Pie charts;
• Gantt charts;
• Bar charts (horizontal and vertical, stacked and independent);
• Single valued (thermometer, compass, speedometer).

I am going to explain how to use the chart library and how to create a bar chart with a custom color. To create a chart with JFreeChart library, first you have to make a Dataset object. The chart is generated from this data collection. Next you have to instate the class DefaultCategoryDataset, which is passed to the chart object. In the code below as a data source is used ArrayList, which may come from data base.

// load the data
double[] data = new double[jobTitles.size()];
for (int i = 0; i < jobTitles.size(); i++) {
     data[i] = jobTitles.get(i).getCount();
}
// create the data set
DefaultCategoryDataset dataset = new DefaultCategoryDataset();
for (int i = 0; i < data.length; i++) {
     dataset.setValue(data[i], "Profit1", jobTitles.get(i).getTitle());
}

The next step is to do an object from chart type. The library uses a class named JFreeChart to display the chart. This chart object is an instance, which comes from the method createBarChart of the static class ChartFactory. The method takes as a parameter the formed collection (dataset). There are many properties, which you can pass to the constructor, such as labels, orientation, etc. It is possible to change colors, size, scale and many other characteristics.

You have ready object now and the next step is to send the chart to the web page. For this purpose, the library includes a class named ChartUtilities that provides several methods for saving charts to files or writing them out to streams in JPEG or PNG format. The methods from this class can be used for creating JPEG images for static web pages. The goal, however, is not to save the chart in a hard drive; the goal is to pass the graphic to the application. To do that, you can use the servlet technology and display the dynamic data stream in the jsp pages.

Consequently the next step is to generate BufferedImage from your chart object and to transfer this stream through the session. You should also write the image in the http response writer.

// create the chart
final JFreeChart chart = ChartFactory.createBarChart("Allocation of Duties",
                 "Values", dataset, PlotOrientation.VERTICAL, true, true, true);
// set custom color
GradientPaint gradientpaint0 = new GradientPaint(0.0F, 0.0F,
                 new Color(209, 228, 246), 0.0F, 0.0F, new Color(82, 141, 201));
BarRenderer r = (BarRenderer)chart.getCategoryPlot().getRenderer();
r.setSeriesPaint(0, gradientpaint0);
ChartRenderingInfo info = null;
HttpSession session = request.getSession();
try {
     // create RenderingInfo object
     response.setContentType("text.html");
     info = new ChartRenderingInfo(new StandardEntityCollection());
     BufferedImage chartImage = chart.createBufferedImage(640, 400, info);
     session.setAttribute("chartImage", chartImage);
     PrintWriter writer = new PrintWriter(response.getWriter());
     ChartUtilities.writeImageMap(writer, "imageMap", info, false);
     writer.flush();
} catch (Exception e) {
     e.printStackTrace();
}

Finally you should write the servlet. This is a Java object, which dynamically answers requests and built response to the client. Each servlet has two main methods – doGet(HttpServletRequest request, HttpServletResponse response) and doPost(HttpServletRequest request, HttpServletResponse response). You need to get the chart stream from the session in the servlet. The image is set to an attribute named chartImage in the session. You have to get http session instance from the request and then to retrieve the previously set attribute.

// Process the HTTP Get request
public void mdoGet(HttpServletRequest request, HttpServletResponse response)
                                       throws ServletException, IOException {
    // get the chart from session
    HttpSession session = request.getSession();
    BufferedImage chartImage = (BufferedImage)session.getAttribute("chartImage");
   // set the content type so the browser can see this as a picture
    response.setContentType("image.png");
    // send the picture
    PngEncoder encoder = new PngEncoder(chartImage, false, 0, 9);
    response.getOutputStream().write(encoder.pngEncode());
}
// Process the HTTP Post request
public void doPost(HttpServletRequest request, HttpServletResponse response)
                                       throws ServletException, IOException {
    doGet(request, response);
}

The result is the graphic below:

JFreeChart is a library for displaying charts and managing their properties with a big palette of options. For more information go to the project official site.

<current_observation>
  <credit>Weather Underground NOAA Weather Station</credit>
  <credit_URL>http://wunderground.com/</credit_URL>
  <image>
    <url>http://icons.wunderground.com/graphics/wu2/logo_130x80.png</url>
    <title>Weather Underground</title>
    <link>http://wunderground.com/</link>
  </image>
  +<display_location></display_location>
  +<observation_location></observation_location>
  <station_id>KSFO</station_id>
  <observation_time>Last Updated on July 14, 9:56 AM PDT</observation_time>
  ...
  <local_time>July 14, 10:01 AM PDT</local_time>
  ...
  <local_epoch>1247590877</local_epoch>
  <weather>fog</weather>
  <temperature_string>52 F (11 C)</temperature_string>
  <temp_f>52</temp_f>
  <temp_c>11</temp_c>
  <relative_humidity>76%</relative_humidity>
  ...
  <icon>fog</icon>
  ...
</current_observation>

For processing this XML we decided to use DOM parser for the following reasons:

• To save the structure of data (more flexible usage for presentation and further processing)
• To ensure good maintainability and adaptability (external provider may change XML structure)
• The XML is not so large that it would not cause memory issues.

Figure 1 the DOM presents an XML document as a tree-structure

DOM Tree

The DOM presents an XML document as a tree-structure. The parser creates a tree object out of the document. The user accesses data by traversing the tree. The API allows for constructing, accessing and manipulating the structure and content of XML documents (Figure 2).

Figure 2 Using a DOM Tree.

For our implementation we use a very simple and effective parser - XMLTreeParser/XMLTreeNode. The implementation consists of two classes: XMLTreeParser and XMLTreeNode. It uses NSXMLParser to read the document and for every one <element> tag creates a XMLTreeNode object. That way, it creates the tree that contains nodes of type XMLTreeNode.

To create a parser, simply instantiate the XMLTreeParser class:

XMLTreeParser* parser = [[XMLTreeParser alloc] init];

After that start parsing – call the parse method and provide the XML data:

<strong>XMLTreeNode* root = [parser parse:xmlData];

Now you can traverse through the tree manually looking for things.

NSArray* items = [stuffindChildren:@"icon"];

Architecture of an XML application using DOM

The DOM model is easiest to understand. On Figure 3, a basic architecture of an XML application using DOM is presented:

Figure 3 Architecture of an XML application using DOM

So here’s what happens: A parser reads the XML file and builds a DOM document to match the XML file. From that point until a save is performed, all interaction between the application and XML hits the DOM document rather than the corresponding XML file. It’s interesting to note that almost all XML parsers use SAX. Before you build a DOM document you must detect events such as the start of an element (start tag encountered), end of an element (end tag encountered) and/or a new attribute (name followed by equal sign followed by quoted string encountered). DOM can be thought of as an extra abstraction to lessen the programmer’s workload, at the expense of memory usage.

Modifications are made directly to the DOM document. Elements can be added, deleted, renamed, and rearranged. Text nodes can be added, delete,d or changed. Elements can be moved either within the same level, or promoted or demoted to different levels.

Choose a design pattern for implementation

Choosing the appropriate pattern is a critical step. The Dynamic Document architectural pattern was used in our case. This pattern contains XML not typed by DTD or schema, but follows assessors for underlying program objects. It allows for unlimited extension by multiple, uncoordinated parties at the cost of lack of type-checking, and it’s simple to implement.

Figure 4 Map the XML document to object model.

The DOM API is used to read information from an XML document. There is an easier way of getting around using DOM for modifying and saving the XML data — creating an object model for the information in the document. You can create this object model by giving it a DOM object that holds all the XML document information. That is, the XML document should be mapped to an object model.

Figure 4 shows how to map the Current Observation XML document to a set of related classes (object model). The <current_observation> element is mapped to the CurrentObservation class; the <display_location> element is mapped to the DisplayLocation class. The <observation_location> element is mapped to the ObservationLocation class. Single elements (without sub elements or others attributes) are mapped to the parent element class properties.  Each class can be instantiated using a method or Factory implementation by providing a part of XML tree, with root – class element. In this the exampleinit method was used -(id)initWithData:(NSData *)data;.

Here is a partial code listing from CurrentObservation.h:

  @interface WUCurrWeather : NSObject {
   NSString *credit;
   ...
   Image *image;
   DisplayLocation *displayLocation;
   ...
   NSString *icon;
  ...
  }

  @property(nonatomic, retain) NSString *credit;
  @property(nonatomic, retain) Image *image;
  @property(nonatomic, retain) DisplayLocation *displayLocation;
  ...
  @property(nonatomic, retain) NSString *icon;
  ...

  - (id)initWithData:(NSData *)data;

  -(NSString *)description;
  @end;

@interface Image : NSObject {
NSString *url;
NSString *title;
NSString *link;
}
@property(nonatomic, retain) NSString *url;
@property(nonatomic, retain) NSString *title;
@property(nonatomic, retain) NSString *link;
- (id)initWidthData:(XMLTreeNode *)root;
- (NSString *) description;
@end

Now you can use your object model to manage data as you wish – save it in a database or show it in a GUI for example.

Example

Below is an example of a View Based iPhone Application that calls a Wunderground Data Feed Web Service to get current weather conditions. The update button repeats the call and refreshes the screen when new data arrives. The screenshots below visualize the application’s behavior:

In the provided source code you can find all these steps implemented.

• SAX (Simple API for XML) is a serial access parser API for XML. It provides a mechanism for reading data from an XML document. The quantity of memory that a SAX parser must use in order to function is typically much smaller than that of a DOM parser. Unlike DOM, there is no formal specification for SAX.
• The Document Object Model (DOM) is a cross-platform and language-independent convention for representing and interacting with objects in HTML, XHTML and XML documents. It represents a tree structure based API. The Dom parser implements the DOM API and it creates a DOM tree in memory for a XML document. Because DOM supports navigation in any direction (e.g., parent and previous sibling) and allows for arbitrary modifications, an implementation must at least buffer the document that has been read so far (or some parsed form of it).

Cocoa offers a “complete” XML parser with the NSXML family of classes.

• NSXMLParser is a SAX parser, meaning that it traverses the XML tree and informs a delegate of events as they happen. This is an event-driven parser, which calls methods on a delegate to handle “events” as it parses through the XML.
• NSXMLDocument provides tree parser functionality. An instance of NSXMLDocument represents an XML document as internalized into a logical tree structure. This tree-based parser is fairly sophisticated but it is not included in Cocoa-Touch.

In the spirit of small and simple, iPhone developers have the NSXMLParser class to use. Because NSXMLParser only generates messages for a delegate, and doesn’t store data about the XML tree, it requires less memory and is better for accessing small pieces of data or parsing large XML documents. The basic operation of the NSXMLParser class will not be covered here. This is well documented in the Apple Programming Guide.

For devices like iPhone where memory usage is critical, using tree parser is not recommended. I guess that is why Apple doesn’t provide NSXMLDocument on iPhone/iPod touch. However, the model of event parsing may not be acceptable by your code. NSXMLParser is probably adequate, but it is not going to handle all your XML parsing needs. The biggest problem with this type of streaming parser is that you lose the structure of your data; your call-backs do not provide any context or hierarchy. Because of the above mentioned or by some other reason like often changing XML format [1] you may need to use something like DOM model implementation.

Available Libraries (DOM model implementations) for iPhone

• XPath/XQuery – used to navigate through elements and attributes in an XML document.
• Libxml2 – XML C parser and toolkit developed for the Gnome project. At Cocoa with Love, very nice explanation and code sample to write wrapper for the libxml2 was posted. It has a title, “Using libxml2 for XML parsing and XPath queries in Cocoa”[2]
• KissXML,TouchXML – two tree XML parsers for iPhone.
• APXML – not a perfect implementation of the W3C XML 1.0 standard, but it’s close enough for a lot of usage.
• XMLTreeParser/XMLTreeNode -  Enhancing the standard NSXMLParser class

Which parser (DOM or SAX) should you use?

Well, if you’re going to need to parse very large XML documents, then you should probably consider NSXMLParser. What “very large” means depends a lot on the available memory you have to work with? The model of iPhone and the memory already in use by your app may prevent you from being able to use DOM model.

While DOM model usage may seem easier, NSXMLParser really excels in situations where you’re loading in many instances of the same kind of data, such as an address book or twitter feed. However, if memory is not an issue, I would recommend DOM model. It makes it easy to access the data you want and also allows you to manipulate the tree.

References

1. Arash Payan(Salman),APXML: NSXMLDocument ’substitute’ for iPhone/iPod Touch – Arash Payan,Sep 27th, 2009
2. jongampark, Tree XML parser for iPhone, 2009

Have you ever gotten the message The URL [your application url here] did not respond. even when everything seems to be working on your side?
One probable reason is that Facebook has a certain response timeout – approximately 12 seconds. If your page fails to respond in this time, Facebook will leave it and display an error message. I used a few simple tricks and managed to work around this issue. Try them out:

Make the Facebook application lighter:

• The basic idea is to make the page as light as possible on the first load. One way to achieve this is to leave the time consuming tasks like database interaction for later, updating the page with AJAX. (more info)

Speed up your Facebook app:

• You can use “Preload FQL”, that is to send your FQL requests along with the first call, thus making one less roundtrip to the server. (more info)
• Facebook provides a Batch API. With this API, you can combine multiple API calls and send them together as one call. (more info)
• You can do the same thing with multiple queries. Wrap, send, and receive them as one using Fql.multiquery. (more info)

AJAX calls have the same timeout issue (although the timeout here is approximately 13 seconds). Additionally all AJAX calls pass through the Facebook server which slows them down. The result is the following JavaScript error: “error”:1349011,”errorSummary”:”Failed to fetch app Ajax” .

I found a simple solution to avoid it: Use FBJS AJAX and a timer to abort the request when it reaches the time limit and send a new one.

Facebook API Response Time and Error Count

The Facebook API itself sometimes has latency issues causing your app pages to be fetched slower, increasing the risk of reaching the response timeout. Errors in request to their servers are also known to happen. You should always be informed about the Facebook Platform Status.

Syntax Limitations in FQL

The Facebook API allows you to make your own queries using a query language similar to SQL. There is a list of tables you can access (you can only view information; you are not allowed to update the information in any of these tables). You can easily make your own queries, but you should keep in mind that you cannot do a number of normal (for SQL) things such as join tables, use ‘distinct’, ‘limit’, ‘group by’, etc., or use “from” against more than one table. You can easily do these operations in the code, however. Combined with the use of the multiquery functionality, things should work almost as fast as if you were using pure SQL.

Facebook API Changes

As you may guess, the Facebook API still is in development, so you should keep yourself up to date with the constant changes in its platform. Some of these changes are potentially breaking, some features are being deprecated or changed, and some cool new things are being added. It is useful to read the Facebook Developer Roadmap to be informed for the specific changes that have been planned and when to expect them. Here are some of the upcoming ones:

• an open source, faster, slimmer, and more efficient JavaScript Library will be developed – I am personally looking forward to this. It will be of great help, as right now the FBJS is very limited.
• profile boxes, application info sections, and the Boxes tab will be removed – If you want to integrate into the user’s profile, you will be able to do that only with Application tabs.
• formatting on canvas pages will be changed to better highlight an application’s brand – For now, I myself am using fb:dashboard. It not only gives you clean app navigation, but also a great look by positioning the name and icon of your app nicely on every page.

Until recently, some of the API changes, even when prepared for them, had unexpected effects on some applications (in some cases, bugs appeared) and there was nothing we could do about it.
In late February, Facebook introduced a tool to help us prepare for the changes – the Migrations tool. When Facebook announces a new feature or fix, you can first do some testing before going to the Migrations tab in your application settings and choosing to enable it (it is disabled by default).

In conclusion, I can assure you that whatever problems you may stumble upon there is a huge community of developers willing to help you out. Just go to the Facebook Developers Forum. There is also lots of documentation and useful tips in the Facebook Developers Wiki. Have fun!

UIWebView load

Our work will start with a little change in calling load method of the UIWebView instance. Instead of loadRequest

[[webView graphWebView] loadRequest:requestObj];

we use the loadHTMLString method, providing an NSString object that contains HTML code of our page as a parameter:

[[webView graphWebView] loadHTMLString:htmlPageStr baseURL:baseURL];

To get this page to load resources and styles correctly, you have to set up the right URL:

Set baseURL property of UIWebView to refer your bundle’s resources directory

Initial loading screen with progress indicator

On the following reference^[2] you can find a short and clear revision of the problem of displaying local images in a UIWebView. To use relative paths or files in UIWebView, you have to load the HTML into the view with the correct baseURL parameter. The following example shows how to do this:

NSString *path = [[NSBundle mainBundle] bundlePath];
NSURL *baseURL = [NSURL fileURLWithPath:path];

And then call load method of UIWebView provide above NSURL parameter:

[[webView graphWebView] loadHTMLString:pageStr baseURL:baseURL];

A short explanation: An NSBundle object represents a location in the file system that groups code and resources that can be used in a program. mainBundle method returns the NSBundleobject that corresponds to the directory where the current application executable is located. bundlePath instance method of NSBundle returns the full pathname of the receiver’s bundle directory. NSURL class is used to create an object which will hold the URL information. It provides a way to manipulate URLs and the resources they reference. loadHTMLString method of UIWebView has parameter baseURL that accept an NSURL object instead of a pathname as the file reference. Giving the above baseURL to UIWebView, you can refer to your bundle’s resources directory like this:

<img src="myimage.png">

Or from within CSS like this:

background-image: url(loading.gif)

It’s important to note that resources (images, CSS and JavaScript Files) inside your application bundle are at the root of the bundle, even if you place them in an separate group (folder) in your project.

Giving the correct URL to UIWebView will allow you to refer to local resources in your page, but it does not work in all cases. If you want to use JavaScipt, some additional settings have to be done.

Link a CSS and JavaScript files

Second loading screen with progress indicator

Now you can use generic HTML technique to add CSS and JavaScript to the web page and displaying in a UIWebView.

<link href="default.css" rel="stylesheet" type="text/css" />
 <script type="text/javascript" src="showhide.js"></script>

Do not forget to add your CSS and Javascript files to the xCode project (if you are using external files).

Some additional actions have to be taken before starting your application and using JavaScript functions.^[3]

XCode setup (*.js) javascript as some type of source code needs to be compiled in the application. We would like to include it as a resource so I’ve solved it by doing two things:

1. Select .js file and in the “Detail” view unselect the bullseye column indicating it is compiled code
2. In the “Groups & files” view expand the “Targets” tree and expand the application then go to “Copy Bundle Resources” and drag the *.js files into it.

The Apple dev forums has a posted solution. ^[4] You need to do two things – select the .js file in your project, and turn off the checkbox that indicates that it is compiled (the “bullseye” column). If you don’t do this, you’ll get a warning in your build log about being unable to compile the file (which should be your first warning – always try to figure out and and correct any and all warnings that appear in your build).

Set transparent background color for UIWebView

Final screen with graph representation.

In our example we need to figure out a transparent background for UIWebView. On the parent View Container we have additional controls (buttons, labels) and already defined background. The following code will set this:

[[webView graphWebView] setBackgroundColor:[UIColor clearColor]];</code>

[[webView graphWebView] setOpaque:NO];

Example

MentorMateDemoJS is a simple application example which uses the settings described above. It is a view-based application that shows a graphical representation of some data. Application behavior consists of a predefined call with formatted data to Vvidget Service^[5] for graph generation. The service returns an image that is loaded in UIWebView Design Resource. The update button is added to resend the graph request and update view.

The Problem: Graph image requires some time for loading.

Our Decision: Notify user of graph loading process by showing a progress bar during load time.

To achieve this, we use UIWebView with local resource of two JavaScript functions. One to show/hide notification messages and the other to visualize a progress bar during loading time. In the provided sources you can find all these steps implemented.

Sources of the example iPhone application

References

1. iPhone SDK Articles, UIWebView Tutorial, August 19, 2008
2. iPhone Development Blog, UIWebView – Loading External Images and CSS, February, 2009
3. StackOverflow, iPhone UIWebView local resources using Javascript and handling onorientationChange
4. Developer Forum, UIWebView and JavaScript, 2009
5. Vvidget, Vvidget Server™ Reference Manual , 2010

The script starts by creating a copy of all of the important information in a staging area.  Keeping the staging area intact will help speed up the backup after it has been run once since rsync is used for most of the copying.  After the staging area is updated, we use rdiff-backup as our incremental backup system.  The rdiff-backup repository can then be copied to other local and offsite locations to increase reduncancy in the backup.  The output is sent by email every time the backup runs, so we are automatically updated on its status, and can correct any errors that may have taken place.

Relevant Tools

Following is a description of the tools that are used to back up our data, as well as some of the tools that are holding out data.  Different sets of data must be backed up in different was in order to maximize efficiency and reliability.

Hardware

We use a mixture of standard desktop hardware, server hardware, and virtual dedicated servers for our infrastructure.  Services requiring reliability are all run on the virtual dedicated servers providing uptime guarantees.  All of our backups are gathered and stored on two local computers, each with a raid 1 array, and copied to an offsite computer.

Bash

http://www.gnu.org/software/bash/manual/bashref.html

Bash is an interactive shell and a scripting language that is installed by default on Linux, and can be configured on many other operating system.  We use it for the backup system because it is easy to call other programs that are already designed to do a lot of the work that we need to do for the backup.  This gets us a full backup in less than 100 lines of code.  The small amount of code makes it easy to proof read and test for errors.

Rsync

http://samba.anu.edu.au/rsync/

Rsync is a very common program for copying data from one location to another when bandwidth can be limited, or when large amounts of data must be copied.  It first checks if the file exists in the destination, and, if it does exist, makes sure that it is that same file.  If the file already exists, and is up to date, the file is not copied.  For our backup, this saves a lot of time since there is generally only a small amount of files that change.

Rdiff-Backup

http://rdiff-backup.nongnu.org/

After the staging area has been updated, we use rdiff-backup to keep track of 10 days of history.  rdiff-backup copies files from the source to an rdiff-backup repository.  Instead of deleting files that have been removed and overwriting files that have changed, it stores a backup of any changes.  It is possible to go into the repository later and restore any version that has not been removed.

OpenVZ

http://wiki.openvz.org/

OpenVZ allows us to quickly and easily set up new virtualized environments, known as containers.  OpenVZ containers are not fully virtualized, so they do not require as many resources as traditional virtual machines.  Our OpenVZ containers are used to quickly and easily set up testing environments, and to provide some of our services within our office that do not have the uptime requirements of the services running on the offsite virtual dedicated servers.

Logical Volume Management

http://tldp.org/HOWTO/LVM-HOWTO/

Logical Volume Management (LVM) is an abstraction layer between the hard drive and the partitions and filesystems on that hard drive.  One or more hard drives or partitions, known as physical volumes in LVM language, can be combined into a volume group.  The volume group can then be divided into multiple logical volumes, which behave like partitions and can be formatted like a normal partition would be.  There are many features in LVM that provide an advantage over normal partition management including resizing partitions and volume groups while the filesystems are mounted, moving the logical volumes from one physical drive to another, also while the filesystems are mounted, and many other management tasks.  Our backup script takes advantage of the ability to create a snapshot of a filesystem.  A snapshot creates another logical volume that is an image of the first logical volume frozen in time.  Any changes that are made to the files on the original logical volume will be stored in the extra space at the end of the volume group that is dedicated to the snapshot when the snapshot is created.  Business can continue as normal as we create a backup from a consistent set of files where we no longer need to worry about someone writing to the files while we are backing them up.

MySQL

http://www.mysql.com/

MySQL is a database that comes with it’s own set of backup tools to ensure that you get a consistent copy of the database.  Mysqldump locks the database when necessary to make sure that it does not make a copy of the database when some other program is in the middle of making a change to the database.

Subversion

http://subversion.apache.org/

Subversion is a version control system.  We use it for all of our development projects to ensure that each team of developers is working with the most recent version of the code.  Because all of our projects use subversion, we have built up a large collection of code that would take a long time to fully back up each day.  We use subversion tools along with some bash scripting to compare the most recent version of the code in version control with the version that we last backed up, and only back up the changes.

Grep, Sed, and Others

http://linuxmanpages.com/

There are many other tools used throughout the script.  The two biggest examples are grep, a regular expression program, and sed, a stream editor which takes some input and changes it as specified.  If you want to know more about any of these tools, you can look them up in the Linux manual pages, or you can find more information on them using your favorite search engine.

Variables

Following are the variables that are used in this script.  Some of the values have been changed for security reasons.

# space seperated list of servers that have openvz and lvm set up
CONTAINER_SERVERS="fox walrus"
# server to put a second copy of the backup on, located in MN
SECONDARY_BACKUP="walrus"
# offsite server
OFFSITE_BACKUP="offsite.server.com"
# Location on the openvz servers where the lvm snapshot of the openvz partition is mounted
SRC="/vzsnap/"
# Location on the main backup server to collect all files
STAGING="/backup/staging/"
# Location of the rdiff-backup repository
RECENT="/backup/recent_backup/"
# Location on the second server for a copy of the rdiff-backup repository
SECOND_RECENT="/backup/recent_backup/"
# Location on the offsite server for a copy of the rdiff-backup repository
OFFSITE_RECENT="/home/backup/recent_backup/"
# Command locations
LVCREATE=/sbin/lvcreate
LVREMOVE=/sbin/lvremove
VZLIST=/usr/sbin/vzlist
VZCTL=/usr/sbin/vzctl

OpenVZ Containers

# containers
echo "Staging Containers"
for host in $CONTAINER_SERVERS
do
   containerlist=`ssh $host $VZLIST -aH -o veid`
   for container in $containerlist
   do
      echo "Backing up $container from $host"
      ssh $host $LVCREATE -L2G -s -n vzsnap /dev/filestore/vz > /dev/null

      # check if the container is running
      run="`ssh $host vzlist | grep --only-matching $container`"
      if [ "$run" == "$container" ]
      then
         # check if mysql server is running inside the container
         if [ -f /vz/private/$container/etc/init.d/mysql ]
         then
            ssh $host "vzctl exec $container 'if [ -f /var/run/mysqld/mysqld.pid ]; then echo mysql is running; echo /var/run/mysqld/mysqld.pid > /mysqld.pid; fi'"
            if [ -f /vz/private/$container/mysqld.pid ]
            then
               pass="`ssh $host cat /vz/private/$container/etc/mysql/debian.cnf | grep --max-count=1 password | sed 's/^password = //'`"
               user="debian-sys-maint"
               ssh $host vzctl exec $container mysqldump --user=$user -p$pass --all-databases > /backup/staging/$container.dump
               ssh $host vzctl exec $container rm /mysqld.pid
            fi
         fi
      fi

      ssh $host mkdir -p $SRC
      ssh $host mount /dev/filestore/vzsnap $SRC
      rsync -a --delete root@$host:$SRC/private/$container $STAGING/
      rsync -a root@$host:$SRC/etc/vz/conf/$container.conf $STAGING/
      ssh $host umount $SRC
      ssh $host $LVREMOVE /dev/filestore/vzsnap --force > /dev/null
      ssh $host rmdir $SRC
   done
done

For each server that is running OpenVZ containers, we want to make a full backup of each of the containers.

1. We use LVM to create a snapshot of the filesystem.  This gives us a version of the files that we can copy that is consistent with itself at a given point in time.
2. In the case that MySQL is running in the container, we want to make sure that we do not get a corrupt copy of the database just in case it was in the middle of a commit when the LVM snapshot was taken.  For this, we will use the standard MySQL backup tool mysqldump.  This will also allow us to easily examine an old version of the database without fully restoring the entire container.
3. Finally, we copy the configuration for the container, and all of the files within the container.

This will give us enough to restore any of our containers to the point at which the backup was taken.

Version Control (SVN)

echo "Staging Source Control"
REPOS=`ssh scm.mentormate.com ls /files/repo/svn/`
echo $REPOS
for repo in $REPOS
do
   echo "processing svn repo $repo"
   head=`svn info svn+ssh://scm.mentormate.com/files/repo/svn/$repo/ | grep "^Revision: .*" | sed 's/^Revision: //'`
   curfile=$STAGING/svn.$repo.lastversion
   # check if there is currently a backup of the repo
   if [ -f $curfile ]
   then
      # if yes, read the last saved file
      current=`cat $curfile`
   else
      # if no, start from the beginning
      current=0
   fi
   if [ $current -lt $head ]
   then
      if [ $current -ne 0 ]
      then
         current=$(( $current + 1 ))
      fi
      padcurrent=`printf "%05d" $current`
      padhead=`printf "%05d" $head`
      # take incremental backup
      ssh scm.mentormate.com svnadmin dump -r$current:$head --incremental /files/repo/svn/$repo | gzip --best > $STAGING/svn.$repo.$padcurrent-$padhead.dump.gz
      echo "$head" > $curfile
   else
      echo "$repo does not have any changes"
   fi
done

We use subversion for version control.   It’s very easy to dump a full backup of a subversion repository, but when the repositories get large, this can start to take a lot of time and bandwidth.  It is better to only back up the new revisions.

1. Get a list of all subversion repositories
2. The head is the version that was most recently committed to the repository.  This can be obtained by checking the svn info.
3. The head that we backed up the last time that we made a backup was saved to a file.  This will give us a range for the last backup that we made to the current head.
4. An incremental backup is taken of only the new revisions, and the current head is written to a file.  The filename will tell us which revisions were backed up.

When restoring this, the files can be combined and loaded into a new repository, or they can be loaded into a new repository one after the other.  If you decide that there are too many files for one repository, you can simply delete all of the files for that repository, including the last revision file, from the staging area, and a full backup will be taken the next time the backup script runs.

Backup Router Configuration

wget -q https://192.168.1.1/diag_backup.php --post-data 'Submit=Download' --no-check-certificate --http-user=admin --http-password="**********" --output-document=$STAGING/pfsense.xml

We use pfSense for our router software.  This allows us great flexibility at a very low cost.  pfSense has a web page with a button for downloading the configuration file.  Wget can be set to send the appropriate information to request the configuration file.  In the event that the router hardware fails, we can quickly install pfSense on new hardware, and load the configuration.

Crontab from the Backup Server

crontab -l > $STAGING/crontab.`hostname`

If our main backup server goes down, we want to make sure that we know everything that it was doing.  All of our important backups jobs run as a single user, so we only need to get one crontab here.

Staging to Incremental Backup

rdiff-backup $STAGING/ $RECENT/
rdiff-backup --remove-older-than 10B $RECENT/

Now that we have everything in the staging area, we want to copy it to a more long term location.  We will do this using rdiff-backup, which will store multiple revisions of our files without making a full copy of each one.  We then need to remove old revisions of the files so that the repository does not get too large.  In this case, we keep 10 versions of the files.

Offsite Backup

rsync -azq --delete $RECENT/ $SECONDARY_BACKUP:$SECOND_RECENT/
rsync -azq --delete --bwlimit=10 $RECENT/ user@$OFFSITE_BACKUP:$OFFSITE_RECENT/

The final step is to make sure that we have multiple copies of our big backup.  The rdiff-backup repository is copied to a second onsite server, for easy restore in the event of hardware failure on the backup machine, and an offsite server.

Conclusion

By gathering all of our information into one place, then taking an incremental backup and sending that to remote servers, we have easily created a backup script that stores incremental versions of all of our important data in one place.