1. Maximize bookmark (This will maximize your window)

   javascript:self.moveTo(0,0);
   self.resizeTo(screen.availWidth,screen.availHeight);

2. To actually get the maximum sizes of your window run this script (the reason is that the screen.availHeight is not the same as your screen resolution)

   function alertSize() {
     var myWidth = 0, myHeight = 0;
     if( typeof( window.innerWidth ) == 'number' ) {
       //Non-IE
       myWidth = window.innerWidth;
       myHeight = window.innerHeight;
     } else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
       //IE 6+ in 'standards compliant mode'
       myWidth = document.documentElement.clientWidth;
       myHeight = document.documentElement.clientHeight;
     } else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
       //IE 4 compatible
       myWidth = document.body.clientWidth;
       myHeight = document.body.clientHeight;
     }
     window.alert( 'Width = ' + myWidth );
     window.alert( 'Height = ' + myHeight );
   }

   Once you figure out the max dimensions here are some bookmarks you can add to get the job done

3. Re-Center bookmark (If the screen width or height is not the same as the maximum resolution of your screen then use the values you got from the above script here. For example: my screen resolution is 1400 X 900 but the actual size of the document is 1400 X 749)

   javascript:var width = (screen.width - window.innerWidth) / 2;
   var height = (749 - window.innerHeight) / 2;
   self.moveTo(width, height);

4. Custom size bookmark (with the window centered). In the example below I choose a 900 X 600 dimension for my window which you can replace with width and size of your choice.

   javascript:self.resizeTo(900, 600);
   var width = (screen.width - window.innerWidth) / 2;
   var height = (749 - window.innerHeight) / 2;
   self.moveTo(width, height);

This definitely works in FireFox and I assume it will also work in Safari with minor tweaks (like maybe using screen.availHeight instead of screen.height etc…)

NOTE: If you are a developer like I am and you are using FireBug or any other type of firefox extensions that take some space within the browser, then you might have to close or hide those extensions when running any of the scripts mentioned above. Otherwise the results may not be as expected for the obvious reasons.

Enjoy!

Caching is very good because the browser doesn’t have to query for the static content for every page request. Most popular browser like IE, FireFox, Safari, Opera first check their local cache for the static file/resource and only if they don’t find do they make a request to the webserver for the same.

With this arises a problem! What if I needs to update one of these static files? Can I force a browser to let go of the old cached instance of the same?

Well the answer is, the infamous, it depends

If a static file like javascript, css, img etc… is cached by a browser with no expiry time then there is no way to update the browser cache other than the brute force way(purge the browser cache or force the browser to refresh the cache). What it means is that there is no way that a web server can force the browser to update its local cache.

On the other hand if there was an expiration time associated with the static file then next time the same instance is requested by a page and if it is expired then the browser will request for the latest from the web server.

But having an expiration time for the static content is not always a preferred or an elegant solution especially with some of the new AJAX application where most of the development is in Javascript and also because its hard to predict how often the content will change. Although in most of the applications I dealt with, an expiration period of a day did very well (not to forget the amount of excess traffic we received every morning)

In this post I will explain how we can handle this in a better, elegant , efficient and effective way.

Before we delve into the details I thought its worth mentioning that there are other options for getting this issue resolved (each with its own advantages and disadvantages)

Here are a few of them

1. Brute Force : CTRL-R (or F5) or whatever the keyboard mapping is to force refresh a page. Another brute fore way is to clear the browser cache every time there is a change. This is plain and simple but not practical in real world and I certainly don’t approve of this. Obviously we cannot ask each and every person using the web application to do this every time a new version is deployed.
2. Force no-cache : In this approach Update the HTTP Headers to not cache anything (Cache-Control: no-cache). This is a crude way of fixing this problem. With AJAX becoming more and more popular these days the size and number of javascript files is increasing more than ever. So if every page request has to fetch all the static files it can affect the performance of the application.
3. Expire Cache : Update the HTTP Headers to cache the files for only a certain period of time (Cache-Control: max-age= <in future>) after which the resource will expire and the browser is forced to fetch a new one.This approach also can get tricky based on what should the actual expiry time be like. Should the expiration be an hour, a day, a week or a month? Well it depends on the application and how often the file changes but still it will never be perfect. There will always be a window of opportunity where the file can be stale. Nevertheless this approach will suite most of the applications that don’t change very often.
4. Versioning static files : By versioning what I mean is to add some kind of dynamic data to the static file names. Here are few ways of doing this
   • Add timestamp to the file name. For example: instead of <script src=”js/prototype.js”> make it <script src=”js/prototype.js?12345455″>.
   • Move all the static files into a sub folder with a number like “12/js/prototype.js” instead of just “js/protoype.js” and for every release (or deployment) bump the number up by one. This approach is good but there are couple of issues. One of which is that all the files under that directory need to be refreshed even if only one of then were changed. Another issue is that your app should be built in such a way that you can make changes like this without having to modify every file that includes these static files.
   • The third way is to update the versions of only the files that were modified. We’ll talk about this in detail below.

Of all these approaches I like the 3rd approach in “Versioning static files”. Now how can we achieve this in J2EE world?

First, the idea is to move the logic of versioning away from all the JSP’s that include it. So everytime we change the version of a static file its reflected in all the including JSP’s. The best way to do this is by using custom tag libraries.

So lets start with a simple JSP (prior to versioning)


<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<%@ include file=“/common/taglibs.jsp”%>
<html>
<head>
<%@ include file=”/common/meta.jsp” %>
<title><fmt:message key=“webapp.name”/></title>
<link rel=“shortcut icon” href=“<c:url value=”/favicon.ico”/>”/>
<link rel=“stylesheet” type=“text/css” href="<c:url value="/css/style.css"/>"/>
<script type="text/javascript" src="<c:url value="/js/prototype.js"/>"></script>
</head>
<body>
<div class="main">
…

</div>
</body>
</html>


To add versioning using custom tag library, the above should look like this


<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<%@ include file=“/common/taglibs.jsp”%>
<%@ taglib prefix=”ut” uri=”/WEB-INF/utils.tld” %>
<html>
<head>
<%@ include file=”/common/meta.jsp” %>
<title><fmt:message key=“webapp.name”/></title>
<link rel=“shortcut icon” href=“<c:url value=”/favicon.ico”/>”/>
<ut:include type="css"><c:url value="/css/style.css"/></ut:include>
<ut:include type="js"><c:url value="/js/js.js"/></ut:include>
</head>
<body>
<div class="main">
…

</div>
</body>
</html>

Here is the utils.tld


<?xml version="1.0" encoding="UTF-8" ?>
<taglib xmlns="http://java.sun.com/xml/ns/j2ee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-jsptaglibrary_2_0.xsd"
version="2.0">

<description>Versioning util library</description>
<display-name>versioning</display-name>
<tlib-version>1.1</tlib-version>

<short-name>ut</short-name>
<uri>http://www.example.org/taglibs/utils</uri>

<tag>
<name>include</name>
<tag-class>org.example.tags.IncludeTag</tag-class>
<body-content>JSP</body-content>
<attribute>
<name>url</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>type</name>
<required>true</required>
<rtexprvalue>false</rtexprvalue>
</attribute>
<attribute>
<name>params</name>
<required>false</required>
<rtexprvalue>false</rtexprvalue>
</attribute>
</tag>
</taglib>

Now lets see the implementation of org.example.tags.IncludeTag

package org.example.tags; import java.io.IOException; import java.util.HashMap; import java.util.Map;import javax.servlet.jsp.tagext.BodyTagSupport; /** * Demonstrates how to use versioning for static content. * In this example the static file and its version numbers are stored * as key values pairs but in real-time it makes sense to have this information * in a file (which probably is generated using a script). These version numbers * can be random or can be the real version numbers from the source control. */ public class IncludeTag extends BodyTagSupport { private String url = null; private String type = null; private String params = null; private static final Map<String, String> versions = new HashMap<String, String>(); // Javascript versions static { versions.put(“/js/js.js”, “113″); versions.put(“/js/prototype.js”, “159″); } // CSS Versions static { versions.put(“/css/style.css”, “158″); versions.put(“/css/tabber.css”, “126″); } public String getUrl() { return this.url; } public void setUrl(String url) { this.url = url; } public String getType() { return type; //return getUrl().substring(getUrl().indexOf(“.”) + 1); } public void setType(String type) { this.type = type; } public String getParams() { return params; } public void setParams(String params) { this.params = params; } public int doEndTag() { try { if (bodyContent == null || bodyContent.getString() == null) { url = “”; } else { url = bodyContent.getString().trim(); } StringBuffer buf = new StringBuffer(); final String type = getType(); if (type.equalsIgnoreCase(“js”)) { buf.append(“<script type=\”text/javascript\” src=\”"); buf.append(getSource()); buf.append(“\”/></script>”); } else if(type.equalsIgnoreCase(“css”)) { buf.append(“<link rel=\”stylesheet\” href=\”"); buf.append(getSource()); buf.append(“\” type=\”text/css\” media=\”screen, projection\”/>”); } pageContext.getOut().println(buf.toString()); } catch (IOException ignored) {} return EVAL_PAGE; } /** * Returns the source value that can be included in the script src * attribute of css href attribute. * @return */ protected String getSource() { StringBuffer buf = new StringBuffer(); buf.append(getUrl()); String version = getVersion(); if (version != null) { buf.append(“?v=” + version); } if (getParams() != null) { if(version == null) { buf.append(“?”); } else { buf.append(“&”); } buf.append(getParams()); } return buf.toString(); } /** * Returns the version number of this file * @return */ protected String getVersion() { return versions.get(getUrl()); } }

So now everytime you have to make a new release just bump up the version numbers of all the files that have been changed and you no longer have to worry about stale or conflicting static files.

Resources

1. http://www.thinkvitamin.com/features/webapps/serving-javascript-fast
2. http://www.websiteoptimization.com/speed/tweak/cache/
3. http://java.sun.com/products/jsp/tutorial/TagLibrariesTOC.html

Stripping off domain logic from Domain Model is what is “Anemic Domain” and as Martin Fowler said, quote domain logic is the antidote to domain anemia unquote.

Lets take for example an Account object. Anemic Domain Account looks something like this (in Java world you would call it a Java bean)

class Account { private double balance; public double getBalance() { return balance; } public void setBalance(double balance) { this.balance = balance; }

class AccountService { public void debit(Account account, double amount) { account.setBalance(account.getBalance() - amount); } public void credit(Account account, double amount) { account.setBalance(account.getBalance() + amount); } }

As shown above the object Account acts just as a place holder for “balance”. In this model most probably some kind of service object (AccountService) sets and gets the value of the balance to reflect any changes to the balance. This is very luring because its pretty straight forward. What makes this Anemic is there is no behavior associated with this Account object itself. So lets add the antidote to this and make it come alive

class Account { private double balance; public double getBalance() { return balance; } public double setBalance(double balance) { this.balance = balance; } public double credit(double amount) { this.balance += amount; } public double debit(double amount) { this.balance -= amount; } }

Now we are talking. We added some behavior to the Account object. In the anemic domain model these methods (credit, debit) are implemented in the service layer as shown above.

What are we really missing in the Anemic version of Account?

Well to answer that question lets assume that we have different types of accounts, RegularAccount and PlatinumAccount.

In the Anemic Version they would look something like this

class RegularAccount extends Account { private double overdraftPenalty = 30.00; public double getOverdraftPenalty() { return overdraftPenalty; } }

class PlatinumAccount extends Account { private double interest = 0.1; public double getInterest() { return interest; } }

So what is the problem here?

Lets say that all PlatinumAccounts, currently, have overdraft protection and RegularAccounts don’t. Then the withdraw methods in the service layer would look something like this

class AccountService { public void debit(Account account, double amount) { if (account.getBalance() <= amount && account instanceof SimpleAccount) { deductOverdraftPenalty(); } account.setBalance(account.getBalance() - amount); } public void credit(Account account, double amount) { account.setBalance(account.getBalance() + amount); } public void calculateInterest(Account account) { if (account instanceof PlatinumAccount) { double interest = account.getBalance() * account.getInterest(); account.setBalance(account.getBalance() + interest); } } public void deductOverdraftPenalty(Account account) { account.setBalance(account.getBalance() - account.getOverdraftPenalty()); } }

As you can see, now the service layer is behaving differently based on the object type (although there are ways to avoid this by having getters and setters for overdraft with zero value for those accounts that do not have the overdraft penalty, but thats not the point here). This has now become a procedural way to getting things done not the OO way.

With the Domain Model we do it the OO way. This is how it would be implemented in the Domain Model

class SimpleAccount extends Account { private double overdraftPenalty = 30.00; private double getOverdraftPenalty() { return overdraftPenalty; } public double debit(double amount) { if (getBalance() <= amount) { deductOverdraftPenalty(); } this.balance -= amount; } public void deductOverdraftPenalty() { this.balance -= overdraftPenalty; } }

class PlatinumAccount extends Account { private double interest = 0.1; public double getInterest() { return interest; } public void addInterest() { credit(getBalance() * getInterest()); } }

Hope this illustrates the point.

Now the important question that keeps coming back to me!!!!

Why shouldn’t we allow the Account object to be able to Save it self by passing the DataSource?

Very good question (although its besides the point of Anemic Domain Model).

The answer to this is, it depends on the application

(To be continued … )

The main reason for doing this is for HA

Here is what I had
1. Clean database (no previous data to deal with)
2. Two clean instances of MySQL 5.0.27 running on separate machines (Host A and Host B)
3. Host A is running 6.0.6 and Host B is running Fedora 5.0

Step 1 (Setup the system)

1. Make sure you are able to ping Host B from Host A and vice-versa.
2. Make sure that you are able to reach port 3306 on Host B (or whatever port your MySQL is configured to run on) from Host A and vice-versa. If there is a firewall configured then make sure to allow the port MySQL is running on. (ex: MySQL -h hostB -u username -p password)
3. It is recommended to have same versions of MySQL running on both the machines, if possible. Otherwise you’ll have to run some additional steps (not described here) to create this configuration.

Step 2 (Configure Master on Host A)

Edit my.cnf and add the following (On Ubuntu 6.0.6 this file is located at /etc/mysql) and add the following

[mysql]
….

log-bin=/var/log/mysql/mysql-bin.log
binlog-do-db= # The database you want to replicate
replicate-do-db= # The database you want to replicate
binlog-ignore-db=mysql # Ignore db from replication
replicate-ignore-db=mysql # Ignore db from replication

server-id=1 # This is very important
…

Step 3 (Create Slave Account on Host A)

Create a replication slave account for Host B on Host A.
mysql> grant replication slave on *.* to ‘repusername’@host_B_IP identified by ‘slavepass’;

This allows slave process on Host B to connect to the master on Host A to initiate the replication process.

Note: You can replace “host_B_IP” with your domain name or your subdomain like “example.org” or “subdomain.example.org” if the IP of host B is not static.

Step 4 (Create Slave on Host B)

Edit my.cnf and add the following (On Fedora 5.0 this file is located at /etc) and add the following

[mysqld]
…

server-id=2 # This is very important

master-host = host_A_IP # The IP address of the master host
master-user = repusername # The username to use to connect to master
master-password = slavepass # The password to use to connect to master
master-port = 3306 # The port where the master is running, default is 3306

…

Now we have a master slave configuration master being Host A and slave being Host B.

Step 5 (Verify Master Slave Configuration)

Now lets make sure that the master slave configuration really works. To do that restart both the database instances.

[hostA@ ubuntu]> /etc/init.d/mysql restart
[hostB@ fedora]> /etc/init.d/mysqld restart

On host B run the following command

mysql> start slave;
mysql> show slave status\G;

*************************** 1. row ***************************
Slave_IO_State: Waiting for master to send event
Master_Host: HOST A IP
Master_User: repusername
Master_Port: 3306
Connect_Retry: 60
Master_Log_File: hostAmysql01-bin.000009
Read_Master_Log_Pos: 4
Relay_Log_File: hostAmysql02-relay-bin.000015
Relay_Log_Pos: 3630
Relay_Master_Log_File: hostAmysql01-bin.000009
Slave_IO_Running: Yes
Slave_SQL_Running: Yes
Replicate_Do_DB:
Replicate_Ignore_DB:
Replicate_Do_Table:
Replicate_Ignore_Table:
Replicate_Wild_Do_Table:
Replicate_Wild_Ignore_Table:
Last_Errno: 0
Last_Error:
Skip_Counter: 0
Exec_Master_Log_Pos: 4
Relay_Log_Space: 3630
Until_Condition: None
Until_Log_File:
Until_Log_Pos: 0
Master_SSL_Allowed: No
Master_SSL_CA_File:
Master_SSL_CA_Path:
Master_SSL_Cert:
Master_SSL_Cipher:
Master_SSL_Key:
Seconds_Behind_Master: 1519187

1 row in set (0.00 sec)

Make sure that the text highlighted shows “Yes”. If not its time to debug. The first place to start will be /var/log/mysqld.log or /var/log/mysql/mysql.log (depending on the settings). See if something is obvious. Some of the obvious errors are “Access denied”, “unable to reach host”. These error messages are exactly not as mentioned here but if you google the error codes you’ll find it quickly.

On host A run the following command

mysql> show master status;
+————————+———-+————–+——————+
| File | Position | Binlog_Do_DB | Binlog_Ignore_DB |
+————————+———-+————–+——————+
|hostAmysql01-bin.000008 | 98 | replicationdb | |
+————————+———-+————–+——————+
1 row in set (0.00 sec)

Step 6 (Create Master on Host B)

Edit my.cnf and add the following (On Ubuntu 6.0.6 this file is located at /etc/mysql) and add the following

[mysqld]
…

server-id=2 # This is very important

master-host = host_A_IP # The IP address of the master host
master-user = repusername # The username to use to connect to master
master-password = slavepass # The password to use to connect to master
master-port = 3306 # The port where the master is running, default is 3306

# The following makes Host B act as a master
log-bin=/var/log/mysql/mysql-bin.log
binlog-do-db= # The database you want to replicate
replicate-do-db= # The database you want to replicate
binlog-ignore-db=mysql # Ignore db from replication
replicate-ignore-db=mysql # Ignore db from replication

…

Step 7 (Create Slave Account on Host B)

Create a replication slave account for Host A on Host B.
mysql> grant replication slave on *.* to ‘repusername’@host_A_IP identified by ‘slavepass’;

Step 8 (Make Host A the slave)

Edit my.cnf and add the following (On Ubuntu 6.0.6 this file is located at /etc/mysql) and add the following

[mysql]
….

log-bin=/var/log/mysql/mysql-bin.log
binlog-do-db= # The database you want to replicate
replicate-do-db= # The database you want to replicate
binlog-ignore-db=mysql # Ignore db from replication
replicate-ignore-db=mysql # Ignore db from replication

server-id=1 # This is very important

# This makes Host A a slave
master-host = host_B_IP # The IP address of the master host
master-user = repusername # The username to use to connect to master
master-password = slavepass # The password to use to connect to master
master-port = 3306 # The port where the master is running, default is 3306

…

Step 9 (Verify Master Master Configuration)

Now lets make sure that the master master configuration really works. To do that restart both the database instances.

[hostA@ ubuntu]> /etc/init.d/mysql restart
[hostB@ fedora]> /etc/init.d/mysqld restart

On host A run the following command

mysql> start slave;
mysql> show slave status\G;

Make sure that the following is true
Slave_IO_Running: Yes
Slave_SQL_Running: Yes

mysql> show master status;

Repeat the same on Host B.

Step 10 (Confirm replication)

Now run your related DDL / DML queries and see them replicated on the slave. Try from both the instances. Enjoy!!!

Resources

1. MySQL Replication