Announcing Silverlight 5

Check it out ScottGu’s blog!

http://weblogs.asp.net/scottgu/archive/2010/12/02/announcing-silverlight-5.aspx

Some interesting questions and thoughts about Future of Silverlight 5 and HTML 5 – what now?

Here you go….http://www.uxpassion.com/2010/10/future-of-silverlight-5-and-html-5/

“Stickiness” implementation using Client Storage ( DOM Storage )– A Non cookie approach

Here I am posting an article of type Non-cookie approach implementation I have tried in one of my development and submitted the same as a white paper in our organization. This is an edited version.

Hoping that it could help the dev community who are all checking about client storage or DOM storage and HTML 5. Enjoy reading..!

What is stickiness?

If a user expands or collapses (toggle [+/-]) any of the tree kind of data display section, it should remain ‘sticky’ for that page even though the user switches to different page/views and come back again.

Possible Approaches

2 types of solutions I could think of:

1. Traditional cookie approach
2. Strategic solution to maintain state with Client Storage – Dom Storage

Traditional client-side storage – Cookies:

Traditionally, web applications have relied on cookies as the client-side storage medium.

Limitations of using Cookies

• Cookie is sent along with every HTTP transaction to the same domain where it was created
• Most browsers have a total size of cookies per domain, restricted to 4096 bytes
• Total number of cookies per domain is limited, although it varies from browser to browser as shown below

Browser	Cookie per Domain
IE 6 and Lower	20
IE 8	50
Firefox	50
Opera	30
Safari	No Limit
Chrome	No Limit

Guiding Principles for Solution

• For each page if there are approximately 10-25 toggle images & pages are more
• 10-25 cookies are required to store each of its toggling Or have to manipulate the same cookie again and again

Details of Solution

Next generation client-side storage – Dom storage

• DOM storage falls exclusively under the purview of client-side scripting
• DOM storage data is not transmitted to the server in every HTTP request
• A web server can’t directly write to DOM storage
• DOM storage currently provides an associative array data model where the keys and values are both strings

Objects used for storage

The storage mechanism involves using either of the below objects:

• userData behavior: Internet Explorer 5.0+
• localStorage:  Firefox 3.5, IE 8
• globalStorage: Firefox 2.0 – 3.0
• openDatabase: Safari 3.1+

Browser plug-ins available to address the storage concerns:

• Google Gears
• Adobe Flash
• Microsoft SilverLight

UserData storage:

• UserData storage is available for an individual document and for an entire domain, based on the security zone.
• These XML files reside in the user’s settings folder and stays even when the user deletes the cookies, temporary files, or autocomplete settings in Internet Explorer.

localStorage (Ex. globalStorage):

• Data placed in local storage is per domain and persists after the browser is closed. Each domain and subdomain has its own separate local storage area.

sessionStorage:

• Session storage is per-page-per-window and is limited to the lifetime of the window. Session storage is intended to allow separate instances of the same web application to run in different windows without interfering with each other. Its limited to tabs – so different tabs means different sessions.

openDataBase Storage:

• Safari only supports this option right now. Uses sqlite as a database backend. It provides a relational database model. The JavaScript database class makes it easy to work with complex, interconnected data in a webpage

Matrix of browser supporting DOM storage objects and their respective size limit

Storage location

Browsers	IE	Firefox	Safari
local Storage	$user\Local Settings\Application Data\Microsoft\Internet Explorer\DOMStore\\.xml	$user\Application Data\Mozilla\Firefox\Profiles\ ewaaloao.default \webappsstore.sqlite	NA
global Storage	NA	$user\Application Data\Mozilla\Firefox\Profiles\ ewaaloao.default \webappsstore.sqlite	NA
openDatabase Storage	NA	NA	$user\Local Settings\Application Data\Apple Computer\Safari\Databases\<host>\<filename>.db
Session Storage	NA	$user\Application Data\Mozilla\Firefox\Profiles\ewaaloao.default\sessionstore.js	NA
Gears	$user\Local Settings\Application Data\Google\Google Gears for Internet Explorer\<domain>\http_80	$user\Local Settings\Application Data\Mozilla\Firefox\Profiles\j7a0a7y8.default\Google Gears for Firefox\<domain>\http_80	NA
Silverlight	$user\Local Settings\Application Data\Microsoft\Silverlight\is
Flash	$user\Application Data\Macromedia\Flash Player\#SharedObjects

User Data Storage

Supported by	IE only, versions IE 5 +
Size limit	Security Zone	Per page storage (KB)	Domain Limit (KB)
	Local Machine	128	1024
	Intranet	512	1024
	Trusted Sites	128	1024
	Internet	128	1024
	Restricted	64	640
Folder location	$user\UserData\\xml>
Type	Persists forever
Expiration	Property available – .expires

Gotchas

• UserData
• localStorage
• globalSorage
• sessionStorage
• openDataBase
• Google Gears
• Adobe Flash
• Microsoft SilverLight

More…..

• The storage data do not travel over the wire
• Like cookies, all store are domain specific
• No default expiration
• Values are stored in clear text format
• http://example.com is not able to access the same localStorage object as https://example.com
• The storage location for each of the browser is different for the storage options, except for Silverlight and flash.
• Silverlight and flash have cross-browser access capabilities.
• All the storage options other than sessionStorage are persistent stores.

JavaScript Frameworks

JavaScript frameworks are evolving to address the storage concern and some of the notable frameworks are listed below:

• jQuery’s Jstore – Provides a consistent interface for store and retrieval of data. Reference: http://www.nabble.com/New-Plugin—jQuery-Persistent-Client-Side-Storage-td22185913s27240.html

• Persist-JS – Superb JavaScript library, provides a consistent interface for store and retrieval of data. Reference: http://pablotron.org/?cid=155

• DojoStorage – This is being revised and be available the perfect shortly as well. Right now it promotes flash store. Reference: http://code.google.com/p/parchment/issues/detail?id=2

• YUI – YUI is working on the client-side storage utility. Hope its already out there.  One reference: http://wonko.com/post/search-pad-browser-storage

 

Storage location

Browsers	IE	Firefox	Safari
local Storage	$user\Local Settings\Application Data\Microsoft\Internet Explorer\DOMStore\<Dynamic Folder>\<filename>.xml	$user\Application Data\Mozilla\Firefox\Profiles\ ewaaloao.default \webappsstore.sqlite	NA
global Storage	NA	$user\Application Data\Mozilla\Firefox\Profiles\ ewaaloao.default \webappsstore.sqlite	NA
openDatabase Storage	NA	NA	$user\Local Settings\Application Data\Apple Computer\Safari\Databases\<host>\<filename>.db
Session Storage	NA	$user\Application Data\Mozilla\Firefox\Profiles\ewaaloao.default\sessionstore.js	NA
Gears	$user\Local Settings\Application Data\Google\Google Gears for Internet Explorer\<domain>\http_80	$user\Local Settings\Application Data\Mozilla\Firefox\Profiles\j7a0a7y8.default\Google Gears for Firefox\<domain>\http_80	NA
Silverlight	$user\Local Settings\Application Data\Microsoft\Silverlight\is
Flash	$user\Application Data\Macromedia\Flash Player\#SharedObjects

User Data Storage

Supported by	IE only, versions IE 5 +
Size limit	Security Zone	Per page storage (KB)	Domain Limit (KB)
	Local Machine	128	1024
	Intranet	512	1024
	Trusted Sites	128	1024
	Internet	128	1024
	Restricted	64	640
Folder location	$user\UserData\<Dynamic folder>\<store-name.xml>
Type	Persists forever
Expiration	Property available – .expires

PNG/GIF – Setting transparency / opacity

http://tinyurl.com/yk76stj – I was checking for PNG transparency for one of my tasks and i found this url with some great stuffs.

You can also find some great and related useful urls in the same page down about the followings:

• PNG transparency
• PNG test image
• PNG image tools
• Edit PNG file

One nice article with examples… http://www.daltonlp.com/view/217