03-25-10
Analysis of Slow Response Times With Javascript Versus PHP
I can only presume that it’s because of the passionate advent of JQuery, that there has been an increasing rise of using Javascript, in precedence of PHP. This circumstance is arguably the sole cause to how and why designers are simply not learning a better way. I’m here to enlighten you.
In opening, I’d like to express, that I hold no animosity for Javascript. Actually I quite often fancy a touch of its elegant lure and almost regularly indulge my viewers with its properties to control aesthetics at a dynamic fashion. But it has its place. If PHP can serve the same purpose, than its obvious strengths, should not be taken for granted.
One prominent example of this that I seem to notice more often in use than others, is the application of color alternating rows with HTML tables, or also favorably known as the “zebra” effect. Which I’ll be using for my reference material.
Zebra With PHP
for ($i = 1;$i < 10;$i++) {
if (($i % 2) == 0) {
echo '<tr class="zebra">';
} else {
echo '<tr>';
}
}
The for() loop, does the accumulating work. It exponentially raises the default value ($i) by one, each iteration, so that the modulus operator (%) can equate the remainder of $i divided by two. So every instance of an even number represented by $i would evaluate to zero.
Zebra With JQuery
$(document).ready(function(){
$("tr:even").css("background-color", "#EFEFEF");
$("tr:odd").css("background-color", "#FFFFFF");
});
The JQuery even and odd filters are used as index selectors. This method can be used on any page element with just a little bit of reverse engineering.
Discovering the Front-End
If you were to analyze the speed of using only Javascript, you would find that it is 16% slower, compared to PHP [1]. Though that number might seem relatively low in scale, because it is, consider all of the other factors when developing for the web.
80% of the average user’s response time is spent on the front-end [2]. This time, is composed of downloading all of the elements necessary to make up the page (Images, libraries, scripts, stylesheets and more). Reducing the number of elements, in turn, reduces the number of HTTP requests required to render the page.
With PHP everything is rendered before any HTTP requests are sent by the server.
Graphically interpreted above are the details associated with load times. This analysis completes the HTTP request cycle from initialization. The darker portion, of each representation, shows the percentage of work involved by the server. As consistency shows, a lot of web design and development, relies mostly on what’s being delivered to the browser.
Summary
It’s certain that a professional web server is going to best the average home network set-up, in performance, any day. It’s your responsibility to take advantage of that, by running some server-side code, to save your guests the frustration of dealing with an idle load time.
References
[1] http://www.timestretch.com/FractalBenchmark.html
[2] http://developer.yahoo.net/blog/archives/2007/03/high_performanc.html
03-24-10
The Most Simple Way to Implement A Flickr Gallery With PHP
In my search for finding a simple solution to any problem, I usually cross many and many blogs and articles, discussing my queried topic. But with so much detail that the solution becomes a problem in itself. So I often times end up resolved to research on my own. In this case, I share how to build the most simple method of displaying a Flickr gallery, with PHP.
Assembling Your Variables
$api = 'your-32-byte-api-key-courtesy-Flickr';
$user_id = '33822702%40N08';
$per_page = 10;
The $api key allows your server and Flickr to “shake hands” sort of speak. You can get your Flickr API key here.
Your $user_id is a static variable that Flickr uses to identify you. This value can be found in the URL of your “photostream”. I’ve left mine for reference (flickr.com).
$per_page refers to how many photos will be retrieved from your photostream. Though this limiter is optional, the default count is, “all”. Which means if you have 1,000 plus photos, it could be a very bad thing, for you or your viewer’s load time.
$xml = 'http://api.flickr.com/services/rest/?method=flickr.people.getPublicPhotos&api_key='.$api.'&user_id='.$user_id.'&per_page='.$per_page;
$xml stores the link, that gets called on to retrieve a list of your photos, as XML. This will also be a part of the script you modify to extend the features of your application based on what’s available in the Flickr API.
$flickr = simplexml_load_file($xml);
foreach($flickr->photos->photo as $p) {
echo '<a href="http://www.flickr.com/photos/'.$p['owner'].'/'.$p['id'].'">';
echo '<img src="http://farm'.$p['farm'].'.static.flickr.com/'.$p['server'].'/'.$p['id'].'_'.$p['secret'].'_s.jpg">';
echo '</a>';
}
$flickr uses a PHP function called, simplexml_load_file(), which interprets an XML file into an object. In this case, $flickr, becomes an array, and we use foreach() to extract the values we need, to display the gallery.
Summary
This method is just what I needed. Something small, easily accessible, and scalable. As you experiment with this script, you’ll afford the opportunity to use many tools, which Flickr offers. You can view a full list here if or when you’re ready.
Download Script (.zip)
03-16-10
New Invention That Could Revolutionize How People Act Online
It’s a box that you install on the underside of your desk and connect to your computer via a USB port…
There’s a software interface the user has to pre-install. Which through an embedded device manager, controls the connection of the box, to a secure protocol of an online storage system that maintains an array of all of your social network pseudonyms.
No login credentials are needed. Anybody can query query the registry, using one of your alias’, to verify an open connection with your terminal. If a response comes back valid, a user confirms action, pays $3 for service and an encoded message is sent through the SSL-encrypted port to activate your box.
When the box receives a signal from the source server, with a valid key that identifies a monetary transfer was completed, it promptly flips open and PUNCHES you right in the dick…
Summary
Of course, the person who gets punched in the dick, also receives a profit-sum of the initial $3 to keep them logging into the system…
The only problem bound to this device’s logic, is that there’d be a lot more swollen-nad ass-hats antagonizing me, now simply for money rather than just being an ass-hat.
Tell me how you think this could be improved?




