E Greeting Portal - Design

E-Greeting Portals

An E Greeting portal is an internet enabled software system using which E Greeting cards can be sent to any of your friends. Typically in an E Greeting portal, there will be thousands of EGreeting cards arranged according to various occasions. So once a person has selected a particular category, he can browse through hundreds of cards available in the particular category using the pagination available on each page. Usually per page around 30 cards are shown .If a particular card looks interesting , the person can click on the same , customize it and send it to his friends. This is how an E-Greeting portal functions. Isnít it simple.

Figure- Figure

Now let us discuss the complexity of this system. Most of these E Greeting cards are very heavy weight objects which hogs a huge amount of browser memory depending on the richness of the content. Sometimes the ECard can be a simple static jpeg image, while sometimes it can have audio, video, animation, movies all within it as well which can hog a huge amount of browser memory. Lets say on an average each card occupies 2 MB of browser memory that means when 30 cards are shown per page, 2*30 = 60 MB of the browser memory is occupied to render one page of the portal and each time we scroll the page 60 MB of the browser memory gets created and evicted every time the page is scrolled.

Let us understand if 60MB of the browser memory is occupied by these cards then the address space of the browser process will get completely clogged and the process will hang.

But we all know usually the E-Greetings portal works pretty fine so how does it work?

The reality lies in the fact that when we say 30 cards are shown per page , it is not that 30 actual cards are shown, what are actually displayed are 30 thumb nails.

What are Thumb Nails?

Thumb nails are miniaturized light weight objects which exactly looks like the actual card with a difference that if the actual card occupies 2MB memory then the thumbnail might only occupy 20kb memory. Technically thumb nails are virtual proxies. When we say thumb nail is a virtual proxy it means thumb nail should have the same interface as that of the actual hidden card. This is the reason the users are not able to understand the difference between the actual hidden card and the thumb nail. Hence if we assume that each thumb nail occupies 20kb of the browser memory , then 20*30 = 600kb of the browser memory will be occupied while displaying 30 cards. Only when a person clicks on the thumbnail (proxy) in the preprocessing cycle of the thumbnail the actual card will be created and loaded and then the call will be dispatched to it.

Figure- Figure

From a syntactic point of view virtual proxies are very simple to implement. In the case of remote proxies the hidden object was already created and the remote proxy only keeps a refernce to it and calls it when the method is called while in the case of virtual proxy, the hidden object is not already existing, it is created in the preprocessing cycle of the request method of the virtual proxy and then the call is dispatched to it.

What are virtual proxies?

Virtual proxies create expensive objects on demand and is used to transparently hide the time at which expansive object gets created.

E-Greeting portals are a classical example of the virtual proxy design pattern.

Hemant Jha
Founder - VPlanSolutions
Researcher, Trainer