Transparent iframes

Firefox by default makes all iframes transparent (no effort required from the developer) if you don't define the background css property.

IE requires extra effort to ensure that the hosting page as well as the iframe's content owner both wanted this iframe to be transparent (few may agree with IE's approach while most will condemn M$). Whatever, here is the css (for page loaded in the iframe) and iframe tag declaration that works flawlessly:

body{
    background: transparent;
}

client side storage: persistjs

Current project that i'm working on, works like a plugin to an existing website. To match to the scale we are targeting, we decided to go the stateless way on the server side; so that we don't necessarily need a sticky behavior on the server side. Now this raised requirement to store state and related data on the client side. On each request client sends the "exactly required" state to the server and server decides on things that need to be done.

If you've read my previous post on cookie size limitations in browsers; you would understand this cannot be done at all. To add to the problem, this project being a web plugin to an existing site, needs to share the cookie space with them and their already existing plugins. We were really concerned if we end up messing with their cookies or they end up messing up with ours (given the size limitation).

And then we found persistjs. You should read all the good reasons why you should use persistjs here. In short, it tries to find multiple possible way to store and retrieve data on the client side. If one method fails, it fall backs to the next available method. The last being cookies and before that flash. This was a relief to us because web stats show ~99% browsers support flash and ~70-80% already have flash plugin installed. In all good/bad probablities, we will end up with a browser which supports one of the client side storage supported by persistjs. It currently supports the following:

• flash: Flash 8 persistent storage.
• gears: Google Gears-based persistent storage.
• localstorage: HTML5 draft storage.
• whatwg_db: HTML5 draft database storage.
• globalstorage: HTML5 draft storage (old spec).
• ie: Internet Explorer userdata behaviors.
• cookie: Cookie-based persistent storage.

Not only that, if we land up to a backend other than the cookie; minimum supported size is ~100KB. Good enough for us. :-)

Thats it for now. We seem to be in good shape on this side. Soon we will be going for full throttle load testing. Will share the results then. Till then, merry christmas (belated) and happy new year (in advance). [;-)]

selecting from a combobox, populated using JsonStore in extjs

gotcha.. it took me quite sometime in figuring this out. I was populating the combobox from a JsonStore and then wanted to select one of the values by default.

The documentation for

setValue(String v) : Ext.form.Field 

says:

Sets the specified value into the field. If the value finds a match, 
the corresponding record text will be displayed in the field. If the 
value does not match the data value of an existing item, and the 
valueNotFoundText config option is defined, it will be displayed as 
the default field text. Otherwise the field will be blank (although 
the value will still be set).
Parameters:

    * value : String
      The value to match

However it doesn't say what does it mean by "value into the field". Atleast i got confused and was trying with all sorts of permutation/combination (this is what happens when you get stuck with something and don't know a way out). It did mean the value that you want to submit along with the form. So just in case some poor soul is stuck like me, here is the code on how to do it.

var jsonStore = new Ext.data.JsonStore({
        storeId: 'my-json-store',
        // store configs
        autoDestroy: true,
        autoLoad: true,
        proxy: new Ext.data.HttpProxy({
            url: /relative_backend_url, 
            method: 'GET'
        }),
        // reader configs
        root: 'response',
        idProperty: 'elemId',
        fields: [ 'name', 'elemId', 'description' ]
    });

jsonStore.on('load', function(store, data){
    Ext.each(data, function (elem){
            if(elem['name'] == some_value_to_compare) {
                var combo = Ext.getCmp('my-json-combo');
                combo.setValue(elem['elemId']);
            }
 });
     // or if you already know the value of elemId, lets call it xValue for which you 
     // want to show the element, go for combo.setValue(xValue)
});

JSON response from the backend looks something like this:

{
    "response": [{
        "description": "Some long description",
        "name": "Name of the element",
        "elemId": "af02a9d6-a11c-11de-bcd5-b2e876978f0a"
    }],
    "success": true
}

Browser's limitation on cookie

Interestingly, now most of them have come to a standard value on their limits. If you've ever worked on client side (i.e. javascript coding), you would really appreciate this and understand why its worth mentioning here. Here are the details:

Per domain limits

1. Firefox - Both 2.x and 3.x allow 50 cookies per domain
2. IE - Until IE6.x they supported only 20 cookies per domain and IE 7 and above this limit has been increased to 50 cookies per domain
3. Opera - Opera 9 allows only 30 cookies per domain
4. Safari - No limits

Maximum Cookie Limit

1. Firefox - Both 2.x and 3.x allow 1000
2. IE - Some posts suggested its 300. ^*
3. Opera - 65536
4. Safari - No limits

Maximum Cookie Size Limit

1. This is almost uniform across the browsers (because they try to adhere to RFC 2109(Section 6.3) and limits to ~4KB = 4096 bytes

If you ever exceed any of these limits, browsers may behave differently. IE and Opera use LRU to decide which cookies to delete. FF seems to be using something different from LRU ^*.

So if you follow Graded Browser Support methodology for your website, here are the recommendations:

1. Keep your cookie count to <=30 per domain. Remember that subdomains can access root domains cookies as well (so xyz.abc.com can access cookies for abc.com domain)
2. Cookie size should not be more than 4096 bytes
3. Use some of the standard libraries YUI Cookie or Ext.util.Cookies for cookie handling

And never forget that cookies are an overhead for any website. Most of the browsers would append them to each request that is sent from the client side; some of them are smart enough to figure which particular "path" really needs them (this depends on which path the cookie was set for). And there is limit on the header size that a server can handle, for example Apache puts a limit of ~8KB. I don't know about others ^*.

* - I did my part of research but ended up with no results. If you've any concrete information, please share with links in comments

5 Tips for Error Handling in Java

1. Avoid throwing an exception whenever possible. In stead return special values e.g. null.


2. Throw early, catch later


3. Either throw an exception or log them but never do both


4. Always throw a checked exception, unless it’s a severe error that cannot be handled by the caller of the api.


5. Maintain layer wise clear abstraction on errors and exceptions so that even if there is a change in the lower layer, consuming layers should not be affected. A particular exception from one layer should never be carried onto the next layer.

Up and running on a new rootshell.be a/c

So few of my friends are planning to attend Y! India hack day scheduled on 14-15th Feb 2009. They just requested a free rootshell.be a/c and thanks to the guys there, they had a free a/c to play with within few hours (Thanks to Xavier and his team at rootshell.be again).

We hit a small problem while hosting our application there. First of all the files we created were not having the right access permissions. Second, rootshell has default configurations to append a little tracking scripts from google to every page that is served from its servers. Now we had problem with this because YAP (Y! application platform) tries to validate a domain by fetching a static file uploaded with some specific content onto the target server. We were getting screwed here because of that small tracking script. This is how we resolved the two issues.

1. All files in ${HOME}/html folder were given 755 permissions so that apache could read and execute them (umm well most of their stuff is going to be dynamic, so uhh you know...).


2. We added a .htaccess file in ${HOME}/html folder to change some of the default settings. The portion that helped us get rid of the tracking script is as follows:
   
   LayoutMerge Off
   LayoutDefaultHandlers Off
   


3. Provide 755 permission to .htaccess file as well so that apache can read it. Else it will be throwing "403 forbidden" errors

But, this is just part of the .htaccess configuration. If you are writing a .htaccess file, it is recommended that you search on Y! Search for tutorials on what all you should take care of. That's all for now. Will keep updating as we go on.

BTW everybody is invited to the Y! India hack day. There are limited seats and final participation will be by confirmed invitation only. So what are you waiting for, go book your seat before they are gone... :-)

Apache configuration journal - I

Redirect all requests for any resource to single file

Steps 1: Requires mod_rewrite

Steps 2: Add following line to <APACHE_HOME>/conf/httpd.conf if it doesn't exist.

LoadModule rewrite_module modules/mod_rewrite.so

Steps 3: Add following lines to .htaccess file in the root directory of your WEBROOT

We are asking apache to redirect all requests which don't have an existing source code to "index.php". This could have been any other existing file in the WEBROOT. This will also prohibit browsing of files in different folders. If you want to enable browsing for folders in your WEBROOT, modify the above .htaccess configuration to

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule (.*) index.php [L]
</IfModule>

PS: This will however expose all the existing directories for browsing by others

However if you want to restrict access to particular type of files, use regex and following kind of configuration in .htaccess

<Files ~ "^\.ht">
Order allow,deny
Deny from all
Satisfy All
</Files>

The configuration above says don't serve any file starting in name with ".ht"

To enable php's default compression while delivering any content (Saves bandwidth)

<IfModule mod_php4.c>
php_value zlib.output_compression 16386
</IfModule>

updated vimrc

In my last post, i explored couple of basic features about VIM. Here is an updated version of my .vimrc. It had some issues with the "hiding tabs" settings as well which is cured in this version (well it wasn't working on my office PC where i had vim 6 instead of 7)

""""""""""""""""""starts here
""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
" Vim As Editor Settings
""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""

" To enable syntax highlighting
syntax on

" come out of vim compatability mode, why go to old vi when we have vim
set nocompatible

" Detect type of the file
filetype on
" Load filetype plugins
filetype plugin on

" How many lines of history to remember
set history=1000

" To enable a color scheme that is pleasant to eyes
:colorscheme delek

" To convert tabs to spaces; use :retab to convert all tabs to current
" settings
set tabstop=4
set shiftwidth=4
set expandtab

" To catch hiding tabs
set list listchars=tab:>-,trail:-

" makes the backspace key treat the four spaces like a tab (so one backspace
" goes back a full 4 spaces)
set softtabstop=4

" enable line number
set number

" have mouse on vim all the time
set mouse=a

" load .vimrc whenever it is edited
autocmd! bufwritepost vimrc source ~/vim_local/vimrc

" Don't indent while pasting
set pastetoggle=<f3>

" Remove indenting on empty lines
map <f2> :%s/\s*$//g<cr>:noh<cr>''

""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
" Vim UI
""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""

" set title of the xterm to the name of the file
set title

" set the height of command bar to 2
set cmdheight=2

" Enable folding
set foldenable
" fold lines with similar indent (collapse feature) or manually in insert mode
" using CTRL-T (indent) CTRL-D (dedent)
set foldmethod=indent
" Don't autofold anything (but can be done manually)
set foldlevel=100
" Don't open folds when you search into them or undo
set foldopen-=search,undo

" show matching brackets
set showmatch
" how many tenths of a second to blink matching brackets for
set mat=5

" do not highlight searched for phrases
"set nohlsearch
" BUT do highlight as you type you search phrase
set incsearch

" show filename and other details about the buffer
set statusline=%F%m%r%h%w\ [FORMAT=%{&ff}]\ [TYPE=%Y]\ [ASCII=\%03.3b]\ [HEX=\%02.2B]\ [POS=%04l,%04v][%p%%]\ [LEN=%L]
" keep showing the status
set laststatus=2

"allow backspace (b), space(s) and arrows to move the cursor to
"previous/next line
set whichwrap=b,s,<,>

""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
" Auto-complete
""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
"set complete-=i

" Turn on wild menu which shows auto-complete options in the command mode
set wildmenu

""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
" PHP
""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
let php_sql_query=1
let php_htmlInStrings=1
let php_noShortTags=1

""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
" HTML
""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
" HTML entities - used by xml edit plugin
let xml_use_xhtml = 1
"let xml_no_auto_nesting = 1

"To HTML
let html_use_css = 1
let html_number_lines = 0
let use_xhtml = 1

""""""""""""""""""ends here

My .vimrc

Well, promised myself long back that i will post technical articles here as well but have been really lazy for quite sometime now. It hits me again and again because i had to look for similar things multiple times. So here i make yet another promise to myself to post those stuffs which i can re-use again and again. Hope some of this would be helpful to others as well.. ahh someday!

This one is my .vimrc settings i configured couple of days ago. Comments inlined for better reading :-)

"---------begins here----------
" To enable syntax highlighting
:syntax enable

" To enable a color scheme that is pleasant to eyes
:colorscheme delek

" To convert tabs to spaces; use :retab to convert all tabs to current
" settings
set tabstop=4
set shiftwidth=4
set expandtab

" To catch hiding tabs
set list listchars=tab:»·,trail:··

" makes the backspace key treat the four spaces like a tab (so one backspace
" goes back a full 4 spaces)
set softtabstop=4

set title

" fold lines with similar indent (collapse feature) or manually in insert mode
" using CTRL-T (indent) CTRL-D (dedent)
"set foldmethod=indent
"---------ends here----------

PS: I will keep updating this post as and while i explore cooler stuffs on VIM. As of now i'm loving it.. :)