Nodejs – First thoughts

My first thoughts on Node as a *real* beginner.

First Take.
I picked up Nodej about 3 years ago when the name sounded cool in the halls of Yahoo. I didnt think much of it and just thought it was the next buzz word. From a PHP developer’s stand point and mostly the standpoint of a MVC framework dude I can honestly say I didnt get it. Here’s what I didnt understand about Nodejs.

  1. No webserver like Apache, nginx, etc.
  2. Javascript in the Backend?
  3. Where’s the routing?
  4. I had to embed my HTML into the JS?
  5. I have to create all new components I have grown to rely on from scratch using Node?

Yep, I was wrong…

Node as a Web Server.
I’m used to Apache, Nginx, and to some degree lighttpd. It has build in modules I can use (mod_*), is super fast (nginx), and can even route my paths any which way (rewrite rules). So why do I need Node?

Because it’s all of those rolled into one. It has modules from NPM, is lightning fast (yet to benchmark), and has advanced routing using modules and/or a framework such as Express. Basically, I was just used to Apache, Nginx is what im saying. Let it go. :-p

Routing & the Uglyness that’s Javascript
OK! so here is where my n00b status comes in. I think Javascript is ugly enough to scare off its own mother. I will be the first to admit (and I know, not the last) that I can’t stand the sheer number of callback function you encounter in a JS file. Wow, blah. Based on what I’m seeing though, there’s a number of tools that allow you reduce the number of callbacks and abstract most of the underlining JS code by using a Framework or a MongoDB ODM such as Express and Mongoose.

Routing. So here’s where I was a bit lost. How did Node map http://www.example.com/accounts/support or http://www.example.com/welcome.html to a document in the file system. Apache, Nginx, map those paths to a document in the web root (or where your DocumentRoot is pointed to). So it’s a no brainer. If you’re using a framework you set up Routing Rules or the framework dictates how it will handle paths by default (think about ZF and Cake). With Node, it’s a different story. You have to create all of it. Instantiate a server, bind it to a port, create a router (or use the FileSystem ‘fs’ module), pass the router to the server, set the encoding type, listen for query data, listen for post data, attach methods to scrub data from query string, add….you get the idea. Ugh.

When starting off, yes this seems overwhelming but take a look at Express or another Node framework. It’s all taken care of.

View Separation
HTML in the JS? “Yea no thanks”, was my first reaction. I used to be a front-end developer back in the days and that was trying times. As I started using Node, I realized I had to do something like this…

response.write("SOME REALLY CRAZY HTML HERE");
response.end();

This turned me off a bit so I kept digging for a View Renderer. Sure enough I found a few engineers using ‘fs’ to pull up a .html file which limited the functionality of the .html file since you couldn’t pass in variables much like a ZF Controller using $this->view->x = “hi there”. So I stumbled upon something nice, EJS. Take a look at that, it was exactly what I wanted!

NPM – Package Manager
One of the nice features of RoR is gem and in the PHP world, PEAR and PECL. Node has something like it but with less documentation (there’s talks on the irc channel for a better system) it’s called NPM or Node Package Manager. It’s very easy to install but you’ll need Node 0.6.X to properly run it. A simple

npm install mongoose

installs mongoose inside a node_modules directory in the path you ran the command. Very easy.

Conclusion
I like what I see. Though I have to admit I don’t yet understand completely the “event-driven” piece to it, I can see why it’s beneficial. I like how the pieces are coming together, and unlike Scala…it doesnt run on Java (see my Scala first thoughts post). So, yes you can say I’m sold.

Quick Helpful Links
#nodejs – IRC (freenode)
nodejs.org – Download it and read the blog
Felix’s Node.js Guide – This guy has tons of neat links. I suggest you take a weekend and eat it up.
Free Beginner Node Book – Very nice beginners book to get you up and running. Recommend & Its FREE!

‘Mongos’ your MongoDB scharding hub

Let’s get right into it. This is going to be a small tutorial on how to shard your data using MongoDB. So grab that cup of coffee, turn on some tunes, and let’s get cranking away. I’m going to assume a few things:

1. You know why sharding is good for managing large amounts of content.
2. You’re ok with not knowing what column(S) to shard against.
3. You have a working MongoDB+PHP set up. (Look at reference if not)

What we’re shooting for
I like to know what im getting my self into before I start any project and I’m going to assume you do to. Once done you’re going to have the set up shown in Figure 1.1. Of course, for this example we’ll run everything on one machine but in a production ready environment you should dedicate each of the services its own server.

Figure 1.1 – MongoDB Shard Topology

The figure above contains 6 objects. The mongo config server, ‘mongos’, 3 mongoDB servers, and your application.

So what’s Mongos (in a nutshell)
Mongos is a service which sits between your application and the mongoDBs. It communicates with the
configuration server to determine where the requested data lives, shard1, shard2, or shardN. It then fetches the data from the shards (if the data lives in more than one location), aggregates the data, and returns it in JSON form.

Setting up MongoDB
I’m going to forgo providing a full list of how-to’s here since there is great documentation on how to install mongoDB on Windows, Unix, you name it here:

1. http://www.mongodb.org/display/DOCS/Quickstart+OS+X (OS X)
2. http://www.mongodb.org/display/DOCS/Quickstart+Unix (Unix)
3. http://www.mongodb.org/display/DOCS/Quickstart+Windows (Windows)

http://www.mongodb.org/display/DOCS/Ubuntu+and+Debian+packages

What I will say though is this. If you run into any issues installing mongoDB on Ubuntu try these steps.
1. Remove mondoDB

> sudo apt-get remove mongodb-client
Listing 1.1 – Remove mongodb-client

2. Follow the instruction here: http://www.mongodb.org/display/DOCS/Ubuntu+and+Debian+packages

Creating the directories
Once you’re done setting up your mongoDB environment we’re going to need a few directories. Each of the below directories will hold the data mongoDB needs. We need 3 directories.


> sudo mkdir -p /db/data/config
> sudo mkdir -p /db/data/shard1
> sudo mkdir -p /db/data/shard2

Listing 1.2 – Create 3 directories

The initial command will create the directory in which the configuration server will place the necessary content for mongos to use. The second and the third lines create the directories used by your mongoDB instances used for sharding.

Setting up the config server
The first step is to set-up our look up system, the configuration server. Mongos uses the configuration server to determine where the content lives mong other things.

> sudo mongod --dbpath "/db/data/config" --port 100381 --configsvr
Listing 1.3 – Creating and starting mongoDB config server

The command shown in Listing 1.3 uses mongod to create and start the mongoDB configuration daemon. We assign it a port number, “100381″, and use the special flag, ‘configsvr’. This allows mongoDB to identify this instance as a configuration server.

Setting up mongos
With the configuration server ready let’s start up a mongos instance and assign it a configuration server to use.

> sudo mongos --configdb localhost:100381 --port 100382 --chunkSize 1
Listing 1.4 – Set up and start up mongos

The above command will start the mongos daemon and use the configuration server we created by using the flag “configdb” and passing it the host and port of the configuration server. Using the “port” flag we also allowed mongos to listen on port 100382 and assigned it a max allowed data size using “chunkSize”.

Setting up the shard boxes
Now let’s set up the boxes containing our data.

> sudo mongod --port 100383 --dbpath /db/data/shard1 --shardsvr
> sudo mongod --port 100384 --dbpath /db/data/shard2 --shardsvr

Listing 1.5 – Set-up and start mongoDB shard servers

The above commands create and start 2 mongoDB shard instances. Both commands start mondod instance, assigning them unique port numbers, assigning a db directory to use (we created these directories above), and finally assign them the “shardsvr” flag.

Adding the shard servers to mongos
Log onto your mongos instance and add the shard servers created above.

> mongo localhost:100382
> use admin
> db.runCommand({addshard: "localhost:100383", allowLocal: true})
> db.runCommand({addshard: "localhost:100384", allowLocal: true})

Listing 1.6 – Add shard servers to mongos

The first command shown in Listing 1.6 connects to the mongos instance. Keep in mind that you will connect to this instance when making changes or fetching data for your application. The second command places you in the admin database to execute further commands. Finally commands 3 and 4 will add the shard. If you want to add more shards simply run the command and change out the host:port to point to the new shard server.

Ok your done. Your environment is ready to accept data. You have set up a mongoDB shard environment using mongos, 2 mongoDB instances, and a mongo configuration service. Awesome, time to test.

Adding data for testing.
Log onto your mongos instance and create a test database, “shardhappens” for testing.

> mongo localhost:100382
> use admin
> shardhappens = db.getSisterDB("shardhappens")
> db.runCommand({enablesharding: "shardhappens"})

Listing 1.7 – Create a database to for testing

With our database created we need to create a collection as well as a key to shard against.
> db.runCommand({shardcollection: "shardhappens.pebbles", key: {item_id: 1})
Listing 1.8 – Shard by a specific key

Listing 1.8 will shard our data within the pebbles collection using the key (column), “item_id”. Now let’s add in some data to shard using PHP.

Add data for testing
Create a file named, “insert.php”, and save it were the above mongoDB environment is set up. Run the PHP script and wait for it to end. Once it’s done you will have data spread evenly across 2 mongoDB instances to play with.


try
{
$mongo = new Mongo("localhost:100382");
$db = $mongo->selectDB('shardhappens');
$collection = $db->pebbles;
for($i=0; $i < 1000; $i++)
{
$data = array();
$data['item_id'] = rand(1, 1000);
$data['text'] = "Hi mom! I'm sharding some data here...*high five*";
$collection->insert($data);
}

}
catch(Exception $e)
{
echo $e->getMessage();
}

Listing 1.9 – PHP to insert data into MongoDB

Once the script has completed log back into your mongos instance and check the chunk sizes for each shard.

> mongo localhost:100382
> printShardingStatus()

Listing 1.10 – Checking shard status

You should see an output similar to the text below.

shardhappens.pebbles chunks:
shard0001 10
shard0002 10

Listing 1.11 – Shard status print out.

The values for 10 might be different for you. That’s it. You just used mongoDB to shard content.

Conclusion
Even though we did not go into much details on shard theory or take a deep dive into mongoDB, you successfully utilized all the mongoDB tools to shard data as well as used PHP to connect and insert content in your mongoDB environment.

References
1. http://us2.php.net/manual/en/mongo.installation.php
2. http://www.mongodb.org/display/DOCS/Sharding+Introduction

CCU, Page Views per minute, Unique Users per Hour, Oh My!

Lately I’ve been fortunate to conduct an array of load tests using very large numbers and I believe I’ve stumbled upon something interesting within the Load/Performance testing community. Or rather something I might not understand yet…that’s also possible. A standardized way to load test.

Let’s take an example. If I want to load test (not stress test) an application and I’m using CCU (concurrent users – how many users are active on the site in a single second) I might have someone inform me that I need to use Page Views per hour or Unique users per hour. Let’s say that we have 100 Unique users per hour on the site. If I load test using this figure for the a duration of an hour to meet the expected 100 Unique users this is where I encounter the dilemma and sometimes confusion.

Did these 100 Unique users arrive in the first minute of the hour? The first second of the hour? Did 10 users arrive every 10 seconds for 100 seconds? Never to return again? So far these questions, from my readings are of no concern as long as you hit your the desired load within the duration of an hour. This is a wrong way to look at it and I believe test. If you’re given a task to load test an application you must check how well your infrastructure deals with the peak CCU load, you might find out that hitting your server with 100 CCU completely destroys it (if this happens at this number you have many problems) .

I’ll discuss a bit more on Benchmarking, Load Testing, and Profiling with a ZF twist and sometimes not going forward.

Armando Padilla

Benchmarking Zend Framework 1.8.4

About 2 months ago I sat in on a PHP performance session at work taught by non other than Rasmus Lerdof.  Aside from creating PHP he had some really neat stuff to talk about concerning performance.  Most of the presentation came from the php.net site, talks.php.net. Take a look at the talks when you have some time.

The question
Anywho…that’s when my benchmarking and optimizing curiosity kicked in.  It wasn’t until yet another talk at work concerning the benefits of an MVC framework (Symfony) that I started to think about Zend Framework and its performance out of the box (without caching).   So I sat down today and started to benchmark the framework with a simple question in mind, “How does a simple ZF application compare to an application not using it?”

The applications
To answer the question I created 3 web projects. The first web project was a static-HTML only application which displayed “hello world” on the screen, very simple.  (For those who just want to see the ab results click here as well as the Xdebug cachegrind output file.)

The second web project was a single PHP file with the below PHP code.

Listing 1.1 – Simple Hello world PHP
<?php echo "hello world"; ?>

The above 2 projects acted as my baselines. it would allow me to determine the overhead ZF introduced into the application.

Finally, the third web project was created using ZF’s Zend Tool and executing the below command.

Listing 1.2 – Zf Project Creation.
> zf create project helloworld_zf

Finally, I replaced the default index.phtml HTML with the simple PHP code shown in Listing 1.1. 

Yes some may say that these examples are far too simple, but I wanted to test the Framework’s process to load and what better way to do this than with a very simple example.  I also based it off the talk that was given comparing Symfony.

The Hardware & ab command
Here is the set-up.
1.  Windows machine running Apache 2.2
2.  PHP 5.2.9
3.  Zend Framework 1.8.4
4.  Pentium 4 3.20 GHz
5.  1Gbs of RAM

I used the Apache Benchmark, ‘ab’, tool which comes included with all Apache installation and ran the below command 3 times.

Listing 1.3
> ab -n 1000 -c 5 http://localhost/index.[html|php]

The results, for me, were very surprising. I have included all the ab outputs.

Observations
HTML ONLY – Reading 1
Concurrency Level:      5
Time taken for tests:   2.344 seconds
Complete requests:     1000
Failed requests:        0
Write errors:           0
Total transferred:      352000 bytes
HTML transferred:       83000 bytes
Requests per second:  426.67 [#/sec] (mean)
Time per request:       11.719 [ms] (mean)
Time per request:       2.344 [ms] (mean, across all concurrent requests)
Transfer rate:          146.67 [Kbytes/sec] received

HTML ONLY – Reading 2
Concurrency Level:      5
Time taken for tests:   2.375 seconds
Complete requests:     1000
Failed requests:        0
Write errors:           0
Total transferred:      352000 bytes
HTML transferred:       83000 bytes
Requests per second:  421.05 [#/sec] (mean)
Time per request:       11.875 [ms] (mean)
Time per request:       2.375 [ms] (mean, across all concurrent requests)
Transfer rate:          144.74 [Kbytes/sec] received

HTML ONLY – Reading 3
Concurrency Level:      5
Time taken for tests:   2.344 seconds
Complete requests:     1000
Failed requests:        0
Write errors:           0
Total transferred:      352000 bytes
HTML transferred:       83000 bytes
Requests per second:  426.67 [#/sec] (mean)
Time per request:       11.719 [ms] (mean)
Time per request:       2.344 [ms] (mean, across all concurrent requests)
Transfer rate:          146.67 [Kbytes/sec] received

Observations:
1.  Roughly 0.0117 seconds per request.
2.  Up to 424.79 requests satisfied per second.

Basic PHP – Reading 1
Concurrency Level:      5
Time taken for tests:   2.609 seconds
Complete requests:     1000
Failed requests:        0
Write errors:           0
Total transferred:      267000 bytes
HTML transferred:       81000 bytes
Requests per second:  383.23 [#/sec] (mean)
Time per request:       13.047 [ms] (mean)
Time per request:       2.609 [ms] (mean, across all concurrent requests)
Transfer rate:          99.93 [Kbytes/sec] received

Basic PHP – Reading 2
Concurrency Level:      5
Time taken for tests:   2.609 seconds
Complete requests:     1000
Failed requests:        0
Write errors:           0
Total transferred:      267000 bytes
HTML transferred:       81000 bytes
Requests per second:  383.23 [#/sec] (mean)
Time per request:       13.047 [ms] (mean)
Time per request:       2.609 [ms] (mean, across all concurrent requests)
Transfer rate:          99.93 [Kbytes/sec] received

Basic PHP – Reading 3
Concurrency Level: 5
Time taken for tests: 2.625 seconds
Complete requests: 1000
Failed requests:        0
Write errors:           0
Total transferred:      267000 bytes
HTML transferred:       81000 bytes
Requests per second:    380.95 [#/sec] (mean)
Time per request:       13.125 [ms] (mean)
Time per request:       2.625 [ms] (mean, across all concurrent requests)
Transfer rate:          99.33 [Kbytes/sec] received

Observations:
1. There seems to be a 100 request (roughly) drop when supporting PHP.
2. Requests per second satisfied =  382.47 (a drop of 42.32 requests or 9% drop)
3. Time per request = 13.073 or 0.0130 seconds per request (Increase of 11%)

Out of the box ZF 1.8.4 – Reading 1
Concurrency Level:      5
Time taken for tests:   68.297 seconds
Complete requests:      1000
Failed requests:        0
Write errors:           0
Total transferred:      197000 bytes
HTML transferred:       11000 bytes
Requests per second:    14.64 [#/sec] (mean)
Time per request:       341.484 [ms] (mean)
Time per request:       68.297 [ms] (mean, across a
Transfer rate:          2.82 [Kbytes/sec] received

Out of the box ZF 1.8.4 – Reading 2
Concurrency Level:      5
Time taken for tests:   70.281 seconds
Complete requests:      1000
Failed requests:        0
Write errors:           0
Total transferred:      197000 bytes
HTML transferred:       11000 bytes
Requests per second:    14.23 [#/sec] (mean)
Time per request:       351.406 [ms] (mean)
Time per request:       70.281 [ms] (mean, across all c
Transfer rate:          2.74 [Kbytes/sec] received

Out of the box ZF 1.8.4 – Reading 3
Concurrency Level:      5
Time taken for tests:   69.656 seconds
Complete requests:      1000
Failed requests:        0
Write errors:           0
Total transferred:      197000 bytes
HTML transferred:       11000 bytes
Requests per second:    14.36 [#/sec] (mean)
Time per request:       348.281 [ms] (mean)
Time per request:       69.656 [ms] (mean, across all c
Transfer rate:          2.76 [Kbytes/sec] received

Observations:
Framework not only has a slower response time but also satisfies less requests per second. Am I doing something wrong???? This cant be correct.

1. Request per second = 15.24 a change of 367.23 requests per second or a drop of 96% between trivial PHP and a ZF power app.
2. Time per request (time taken to satisfy 1 request) = 328.49 ms or 0.328 seconds a change of .315 seconds or an increase of 23%

Conclusion
Even though my benchmarking techniques might be flawed, taking a base line reading with no HTML as well as a very simple PHP script web project allowed me to at least compare. 

Based on these figures (if correct) Zend Framework has a HUGE overheard.  But this should not discourage any would be ZF coder because there are caching techniques which were not used such as using APC and the benefits of a good network admin :-)  

Also the benefits of using any framework far outweigh the drawbacks in my personal opinion.  Where else can you get code which has been tested by the best and packed to contain methods for many of our typical coding requests.

Armando Padilla.

HTML5, Chrome, and WebDatabase.

I started to get the HTML5 itch a few weeks ago so I started to look around the web to feed my appetite for all things HTML 5. Turns out info is pretty hard to come by. Not sure when your reading this but its been tough to find adequate examples of what IS and what ISNT implemented yet since it all depends on the browser your using. Anyway. So im going to jot down my notes on using HTML5′s Web Database here by creating a few examples.

Quick Agenda
1. What is HTML 5.
2. What you need to get started.
3. The tool to view the DB
4. How to create AND connect to a DB.
5. How to create a table.
6. How to insert/update/delete records into a table.
7. How to list records in a table.

Let get the ball rollin’ now…buhahah

What is HTML 5.
HTML 5 is a collection of new tags, (list here) and along with the new tags it provides a tool set to store data on the user’s machine using javascript, yes Javascript (Web database API here).

What you need to get started.
For the example you’ll need at least Chrome 4. Of course you can use any browser you wish but YOU NEED TO BE SURE HTML 5 WEB DATABASE IS SUPPORTED.. I strongly recommend you download and install Google’s Chrome browser, so far it’s great. Click here for download link.

Thats all you need, oh! and you’ll need some HTML and Javascript know-how.

Figure 1.0 - Chrome Developer Tools

Figure 1.0 - Chrome Developer Tools

The tools
If you don’t have Chrome installed skip this section. This section will show the visual tool Chrome supplies developers to view not only the database but other neat things about your page.

Load the web page your going to test on. In my case its http://localhost then click on the “Control Page” document icon on the far-top-right corner of your browser . Select Developer > Developer Tools. (Figure 1.0)

You should now see a window as shown in Figure 1.2 (minus the DB). If you do not see the information displayed on Figure 1.2 click on “Storage” on the top menu. The “Storage” window contains a nice little DATABASE list on the left along with other items specific to that page. At the moment there’s no databases so you wont see anything. This is just the place where you’ll be able to work with the DB :-)

How to create AND connect to the DB
Let’s create a database. Our database will have the name, “test_database” and will be our initial 1.0 version. (Note: the database name is case sensitive)

dbObj = null;

function connectToDB(){
  dbObj = openDatabase('test_database', '1.0',
                                 'Test Database', 1024*1024*3);
}

connectToDB();

1. openDatabase(‘name of db’, ‘version’, ‘database description’, total bits table will use, call back function)

The callback function is used to create the table structure if present. In this example we’ll create the tables later. Also note that the size of the database is dependent on the amount of free space the user has available.

Developer Tool Database

Figure 1.2 Developer Tool Database

It is also recommended that the site only take up to 5 mbs of space. The spec also mentions the user will be prompted when the site requests additional space. (quote)

Once you run the above javascript on your sandbox, pull up the Chrome Developer tool, you should now see the database (Figure 1.2)

How to create a table.
Were going to add a table. We’re going open a connection to the database again as shown in the first example and then use the SQLTransation object to execute a CREATE statement.

dbObj = null;

function connectToDB()
{
   dbObj = openDatabase('test_database', '1.0',
                                   'Test Database', 1024*1024*3);
}

connectToDB();

  //Create the table method
createTable = function()
{
   dbObj.transaction(function(SQLTransaction){
        SQLTransaction.executeSql(
        "CREATE TABLE userinfo (id INTEGER PRIMARY KEY, item1 TEXT)", [],
        function(){ alert('I am a successfull callback function!'); },
        function(){ alert('Oh no! I am a sad error callback function'); } );
      });
}

createTable();

Copy the above javascript, place into your file, and refresh the page. You will now have the table ‘userinfo’ in our database. If you want to add more tables simple call the method once more with a different CREATE statement. (Figure 1.3).

Some explaining…
SQLTransaction has 2 methods, transaction() (Read/Write) and readTransaction() (Read only). We use the transaction method when we need to read AND write. The readTransaction() has only ‘read only’ functionality and best used for SELECT SQL statements.

To execute the SQL statements we use the executeSql() method. A parameter explanation is shown below.

executeSql(‘SQL Statement’, [], success callback function, error callback function) . The [] contains values for each ? used within the SQL statement. “INSERT INTO userinfo (item1) VALUES (?)” will replace the ? with the the content to save for the specific column. It’s also recommended to use this feature to code against SQL Injection attacks. (quote)

How to insert/update/delete records into the DB
At this point UPDATE, INSERT, as well as DELETE statements use the same process as the previous example. We use the SQLTransaction.transaction() method as well as the executeSql() method.

The next example will insert a record into our database table, ‘userinfo’, and we’ll verify the data entered using the Chrome Developer tool. Please note that the below code assumes you already created the table.

dbObj = null;

function connectToDB()
{
   dbObj = openDatabase('test_database', '1.0',
				   'Test Database', 1024*1024*3);
}

connectToDB();

//Insert record into Table.
insertRecord = function(item1)
{
   dbObj.transaction(function(SQLTransaction){
      SQLTransaction.executeSql("INSERT INTO userinfo (item1) VALUES (?)", [item1],
   function(){ alert('Record saved!'); },
   function(){ alert('Uh Oh! record not save!'); } );

   });

}
var item1 = "your not funny dude..really your not.";
insertRecord(item1);

Figure 1.3 - Verifying our record was inserted.

Figure 1.3 - Verifying our record was inserted.

Pull up your Dev Tools Window again, expand the database by clicking the arrow, and click on the table. The record you just inserted will be displayed on the right as shown in Figure 1.3. Thats great but let’s now focus on retrieving the records to possibly manipulate the data!

How to List records
With data in our database, lets fetch the record we have in the table. To do so we use the read/write SQLTransaction method, readTransaction().

The following code assumes you have the database created, table created, and information stored in the table. If not go back and read the different sections.

dbObj = null;

function connectToDB()
{
   dbObj = openDatabase('test_database', '1.0',
				   'Test Database', 1024*1024*3);
}

connectToDB();

fetchRecords = function(){

   dbObj.readTransaction(function(SQLTransaction){
      SQLTransaction.executeSql('SELECT id, item1 FROM userinfo', [],
				function(SQLTransaction, data){
                                displayRecords(data); });
		});

}

displayRecords = function(data){

   var a = document.getElementById("text");
   a.innerText = data.rows.item(0).item1;

}

fetchRecords();

In this example we query the table and display the results of the call. We use the SQLTransaction readTransaction() method, SQLTransaction executeSql() method passing in the SQL statement and a call back function displayRecords(). If the SQL SELECT statement successfully ran we pass a SQLResultSet object, ‘data’, to the displayRecords() method. The displayRecords() method fetches the HTMLElement node, ‘text’ and sets the text for the node to be the record fetched item1 value.

Fetching a specific value for a row.
To fetch the record we use the SQLResultSet object’s ‘rows’ attribute which returns a SQLResultSetRowList object. We then use the ‘item()’ method to fetch a specific row in the row list. In this case we fetch the first row and call the objects class property, ‘item1′. Note that each column in the table is represented but a class property.

Conclusion
We covered all the basic features of the HTML 5 web database. Inserting, creating a table, connecting to a DB, and fetching records. Give it a shot, if you have any questions feel free to leave a comment or refer to the W3C page :-)

Armando Padilla

Google I/O 2010 – Day 1

Google I_O_Talk_Speed_TracerAttended my first Google I/O this year and truth be told I wasnt sure what to expect. My goal was to learn a bit more of Architecture, performance, and HTM 5. Looking back at day 1, I came away feeling good that I actually made it to the event given that I felt like just heading into work.

These are my notes for the first day. The below were the talks I chose to attend and created a quick PowerPoint Deck for a portalble version of the notes.

My Schedule:
1. Measure in milliseconds redux: Meet Speed Tracer [ My Notes: Powerpoint Deck Download ]
2. Beyond JavaScript: programming the web with native code
3. Architecting for performance with GWT
4. Developing With HTML5
5. GWT Linkers target HTML5 Web Workers, Chrome Extensions, and more

Stay tuned for tomorrows deck.

A week at ZendCon 2010

Monday through Thursday what a ride. Yes I did miss some of the keynote speaker and yes I snagged a lunch which didnt belong to me. Sorry Sorry…ugh :-)

Anyways ZendCon was awesome! I’m not sure why this event does not have more participants but I have to say that I greatly enjoyed it. Thumbs up to the organizers as well as the speakers. Ill be attending Zendcon until i drop dead. :-)

Here are some key take aways from the conference.
1. Someone took Matthew Weier O’Phinney voice. He lost his voice, yet continued to participate in the talks. Pretty hardcore if you ask me.
2. If you’re not already looking at the cloud. Look up and try to spot one. No really, start reading up on it.
3. The Zend Framework 2.0 is being worked on and looks very promising in terms of performance.
4. The Zend Framework wants your feedback in terms of a Migration plan and bug hunts!
5. Zend Framework now has mobile support.
6. You MUST attend Zendcon 2011.

Reasons to attend Zendcon – Reason #1 – Networking
Does this sound familiar? “Meh, ill just read the Power Points when they are posted”. Yes that was me and it might be you. Though this is a good alternative, if you have no way to reach the con or cant come up with the $ to pay for it (btw ask your company if they can help you with this. Most companies do) I have to say that you’re missing out on a lot. The network of people you build while at the conference is great. You talk about lessons learned while tackling a specific problem and if the conversation attracts enough people youll find yourself huddled around a table chatting it up with 5 others with the same issue.

Reason #2 – Information Information information!!!!
The second reason to attend the conference is the ability to learn what other organizations are doing. I can not stress this enough. Being blind or not caring about the direction of your competitors or an industry leader in your field is tantemount to jumping out of a plane without a parachute (FAIL).

As a developer you want to know what company X is doing, how long they have tried this approach, and where its taken them. For all you know they failed and your team/company is close to implementing the same solution because it looks ‘attractive’…on paper. Zendcon provides this. I loved the open forum style talks. Each speaker shared their experiences from the field and allowed the audience to also share their experience. And yes I was typing away all these notes for my knowledge locker just in case i ever run into a similar situation.

Reason #3 – The Measuring stick doesnt lie
Finally the last and third reason I enjoy going to conferences and now enjoy going to this one. I like to measure where I’m at as an engineer. If you want to be good at what you do its not simply about building apps its about surrounding yourself with the people you want to be like. Learning from them, listen to what they are talking about, and listen to what they failed and succeed at. For me, the individual sitting on stage was a good reminder as to where I want to go. They encompassed the “do’ers” of the community in my book and with Matt it was more the breath of knowledge the guy has in his head. I kinda wanted to ask him what were the next steps to becoming a good developer and what he recommended someone in my area do to grow. But I chickened out. Next year.

All in all Zendcon a good conference to attend as a PHP developer and hope to see you there next year!

P.S. I will be posting my notes here shortly (this time for real. I know i promised slides from the Google I/O)