phpDevelopment | Blog » Various

Most interesting links of February 2010

Andrei Gabreanu — Mon, 01 Mar 2010 10:20:24 +0000

Here is my collection of best link references of February 2010:

Implement a Rest API with the Zend Framework

Implement a Rest API with the Zend Framework is a great article posted on the “Realm of Zod” blog by Brandon, which shows you how to build your own Rest Server and Rest Client with Zend Framework. It gives you all the details required to get you started on the RESTful path of WebServices.

Font type tester (includes font-face tests for CSS3)

Typetester – Compare fonts for the screen is a very very useful site for both designers and developers who want to give a nice artistic touch to their website without having to research countless hours for an appropriate font that might work or not for their needs.

960 Grid System – CSS Framework

960.gs is the leading CSS framework on the market. Even if you don’t like to use CSS Frameworks or didn’t know they existed, 960gs will provide you with core elements that will help you speed up your design2html process. For all of you who didn’t try it yet, you should definitely give it a shot. You won’t regret it.

High Resolution Bokeh Texture

High Resolution Bokeh Texture is part of the freebies category. It includes a pack of bokeh textures to share & use in your design projects. The package contains 5 textures with high resolution (240 dpi) 3456 x 2304.

Out of focus 30 free bokeh textures

Out of focus 30 free bokeh textures is part of the freebies category again, this time with more textures for your design needs. The package contains 30 textures for your free use.

Getting Started with XSL(T)

Getting Started with XSL(T) is the final interesting link of the month. It is an article written by Chad Hietala for Net Tuts Plus where he explains how to get started with the XLS(T) which is an alternative to the HTML design we all have used so far. If you are curios why even bother looking this up, you might need to know that Blizzard World of Warcraft armory is purely made on XLS(T)

MySQL Replication for dummies tutorial

Andrei Gabreanu — Sat, 21 Nov 2009 01:05:12 +0000

One of the most used RDBMS (relational database management system) is MySQL. MySQL stands for “My Structured Query Language“. It currently has more than 6 million installation world-wide and can be installed on almost any OS varying from UNIX systems to Windows. Thus, chances are you are already working with it.

Now, there comes a time when your fresh website explodes in terms of traffic and your server cannot face it. In such case, you should consider two things:

Revise all your queries and try to optimize them
Use Database Replication

We won’t talk about query optimizer since there are a lot of tutorials and sites that describe how exactly to do it and it should be your primary goal in the process of making your website run smoother.

What is Database Replication

Database replication is the process of sharing information between redundant sources, to improve the overall performance and reliability.

This means that you can have your database on one server, manage all Write dependent operation on that server and use a separate server for all the Reading operations. A practical example would be a search engine.

A search engine could consist of a crawler (the back-office) and the actual UI which is displayed to the user. The user would read information from the database while the crawler would write that information actively. This way, you could have the crawler set on a server (the master server) and the actual application on another server (the slave). Every time the master server writes data to the database, it will be almost instantaneously available to the slave server, thus the user will see no difference but your overall performance will be boosted.

Database replication can be of two types (master-master or master-slave). The simplest and the most spread scenario is to the master-slave type. Let’s see how we can create such a system on our own servers…

Prerequisites

In the next few chapters i will assume the following:

You are in a Linux environment (i will be talking about CentOS but with a bit of research regarding each file path, you can set it up on any Linux distribution)
You have access to SSH as root (or a user with root privileges)
You have access to the MySQL root user
You have an empty database on both of your master and slave server.

Configuring the Master Server

Login to your Master server via SSH as root.
Go to your /etc folder ( run the following command: cd /etc )
Make a backup of your my.cnf file found here ( run the following command: cp /etc/my.cnf /etc/my.cnf.old )
Edit the file /etc/my.cnf with nano ( run the following command: nano /etc/my.cnf )
Add the following lines somewhere in the section [mysqld]
```
log-bin=mysql-bin
server-id=1
```
Restart MySQL (run the following command: /etc/init.d/mysql restart )

Adding a user with replication privileges to the master server

Login as root to your MySQL account ( run the following command: mysql -u root -p )
Enter your password
Grant replication privileges to a user for a database with the following command: (replace some_password with a real password and some_user with a random username you prefer)
```
GRANT REPLICATION SLAVE ON *.* TO
'some_user'@'%' IDENTIFIED BY 'some_password';
FLUSH PRIVILEGES;
```
Get the MySQL log file ID (it is mandatory that you fetch this so that you will have only one log file for the entire operation)
```
SHOW MASTER STATUS;
```
If you did everything ok you should now have a table in front of you with at least 2 columns: File and Position. Write the values of these columns somewhere.
Unlock the MySQL tables with the following command
```
UNLOCK TABLES;
```
Exit the MySQL interface by running
```
quit
```

Configuring the Slave Server

Login to your Slave server via SSH as root.
Go to your /etc folder (run the following command: cd /etc )
Make a backup of your my.cnf file found here ( run the following command: cp /etc/my.cnf /etc/my.cnf.old )
Edit the file /etc/my.cnf with nano ( run the following command: nano /etc/my.cnf )
Add the following lines somewhere in the section [mysqld]
```
server-id=2
```
Restart MySQL (run the following command: /etc/init.d/mysql restart )

Setting up the link between the Slave and the Master

Login as root to your MySQL account ( run the following command: mysql -u root -p )
Enter your password

Run the following LONG command:

mysql> CHANGE MASTER TO
     > MASTER_HOST='master_host_name'
     > MASTER_USER='replication_user_name'
     > MASTER_PASSWORD='replication_password'
     > MASTER_LOG_FILE='recorded_log_file_name'
     > MASTER_LOG_POS=recorded_log_position

Quit and restart mysql.

Conclusion

If everything was setup ok, you should now be able to go to your Master server, insert data into your replication database, and then, when you go to your Slave server, you should be able to see each row inserted in real time.

Would you like to have an article like this about master-master replication?

11 Tips to maximize your web application performance

Andrei Gabreanu — Tue, 13 Oct 2009 21:27:44 +0000

It is incredible how much time it is spent on having awesome features in a web application but so little time spent on optimizing it. The user experience is composed of 80% page load time and 20% of the UI (user interface) and functionality. Although this fact is know for ages, there are tons of web applications and web sites that ignore this and tend to ignore each of the following tips focusing on giving the user a rich experience but ignoring the fact he has to get there first. And he has to get there fast.

The following tips should be taken in consideration before actually building your website (but they can still prove valuable if added after). The tips are a concise list formed from both Yahoo & Google experience on the web that these two web giants freely shared with us, the web community.

1. Use a subdomain for your static files

There are many explanations about why to do this, but the conclusion is that, you should distribute all your static files into HTTP requests from 2 to 4 (but no more then 4).
The perfect example would be, for example:

www.yourdomain.com : This would be the base domain your users are going to land on.
images.yourdomain.com : This would be the domain where you will put all your PNG’ and GIF files (or all static images)
scripts.yourdomain.com : This would be the domain where you will hold all your javascript and other scripts (only use static scripts here!)
static.yourdomain.com : This would be the domain where you should host all your CSS files and other static content

2. Set cookies on the www subdomain

In a few words, if you make a request to a domain above (like scripts.yourdomain.com) and you have in your application 10 cookies set, each having 0.5 kb, then for each image request you will send 5kb through. And you don’t need cookies for static content, do you?

Example: 

Set all cookies to "www.yourdomain.com"  (not *.yourdomain.com). 

Since images.yourdomain.com is not part of www.yourdomain.com 

then it won't send them through the request.

3. Use cache-control for each of your static content to a long period

Basically, since you are using static content then, you don’t want to change it very soon (that’s the whole idea of static content). This way you can make sure that the user will not make more requests or transfer any more precious kilobytes after 1 month of inactivity on your website for example. A good choice is to set them to 1 year or more.

Example

In your .htaccess file 

ExpiresDefault "modification plus 10 years"
ExpiresByType text/html "modification plus 1 minute"

4. Name your static files with the version number

Every static file should include in its name the version of the file (ex: myFileName-1.2.3.js ). This way, in case you do need to change the static file then deleting it from the webserver and adding the new version won’t change a thing for old users since they will have the cache active in their browser.
To overcome this, upload your next version of the static file and tell your page to use the new version. This way, the browser will only make a request for the new file and the old file will be deleted from the cache (and also you should delete it from the server).

Tip for development: 
You should (almost) never have more then 1 file for 
javascripts and stylesheets.

5. Always put your CSS file in the head tag.

This is actually a fake performance improvement. The whole ideea is to let the browser first load the CSS then, since the css is loaded, the page will appear to load progressively rather then make the user see a white page for X mili/seconds and then *bam* see the whole page. You can think of it like an old-school progress bar without the bar.

6. Always put the javascript at the bottom

You won’t need the javascript unless the document is loaded (or you’re doing preloading). It is a very good ideea to insert your javascripts at the end of the file. If you use a library like jquery, put it in the head but dont forget the $(document).ready(). In both of these cases, stop using javascript inline or if not possible, don’t use it in the entire document. Have a common place where to put the Javascript.

7. Use CSS sprites but dont overuse them!

The ideea here basically a very easy comparison:

Basically if your web application has 10 images to load, made of 8 buttons, 1 background and 1 header, each having, let’s say, 10 kb then this means you will download 100 kbs in total.
The problem here is that, for these 10 items, the browser will make 10 requests. This is very very bad. Instead of doing this, use CSS Sprites.

Your 10 images would become 1 image which should have the exact size(well ok, 0,001 bytes more since you’ll have a 1px delimitation between elements. You will download the same amount of data from the server but all in one request. This is a huge improvment to the performance of your website.

However, if you overuse CSS sprites, you will end up loading images that your user may never see! For instance, if those 10 images were in fact made of 7 menu buttons, 1 for header, 1 for background and one for a nice picture of you in the contact page then, if your application is not likely to provoke users to contact you, loading it in the homepage would be a bad idea overall. Try to group common items in the same image

8. Consider preloading items

Preloading items is a very intelligent technique: For example, if your homepage contains a nice web 2.0 stylish button that says TRY FOR FREE then it might be a good idea to load (either by CSS or javascript/html) all or some of the static files that the user will find in the “TRY IT FOR FREE” area of your website. In a few words, you can load items that you think your visitors will likely access in their next step.

Again, don’t overuse this since studies have shown that with each 100ms loading time, you loose 1% of the traffic of your website. So don’t load your entire site in the homepage.

Google uses this smart technique to load the items in their homepage for their results page since the user is most likely to go there after visiting the homepage.

9 . Use gzip for all your content

This is a very important aspect to take in consideration. The improvement given by GZIP compression is close to 90% faster then the actual speed of your content without it. To use GZIP you can either do it with PHP (or any other scripting language) or with Apache with mod_gzip.

10. Use a CDN for your files

The costs of a CDN are so small nowadays that you should ask yourself, why not use it? It can give you that extra speed you need in your application to keep your users from going away. It is so simple to setup and yet so powerful, that you should do it as soon as your website turns into profit.

11. Minify your CSS and Javascript files

It is common sense to know that, smaller files in size mean smaller bandwidth usage, ultimately giving you an extra speed boost. You can use either Yahoo or X to minify your scripts.

Got any more cool techniques that you think could help the community? Share them in the comments below!

How to make a simple backup program using a BAT file

Andrei Gabreanu — Fri, 11 Sep 2009 17:37:50 +0000

Custom backup software are either very bad, expensive or too complicated for us. As developers, its our duty to backup our code all the time in case some major wastrel comes into stage. In case anything wrong goes with the deployment of a project or perhaps just a power loss during a simple upload on a server, you can have your work backed up and just revert to that version of the application. In the following lines, we will see how to write a very simple backup software (nothing fancy like SVN or any other tool) that will backup our files from day to day (or even more frequent). All you have to do is write two lines of code in a BAT file(or perhaps more if your project has different locations overall) and setup a simple Task Schedule.

The steps are simple:


Create a file on your machine, named backup.bat..
Right click on it and click EDIT
Copy paste the following lines into it: 

Echo Making Backup 

mkdir "your_backup_path\backup\%DATE%"
xcopy "path_to_project" "your_backup_path\backup\%DATE%" /E 

Echo Finish
Pause
Now just go to control panel / task manager
Setup a task to run every day (or anything you like) and point 
the task to your BAT file.
You are done!

Make sure you schedule the task to run when you are not working (since it will backup your files with alterations of your current code).
If you want more paths, just include the xcopy command more and change your paths there.