We have today released the first BETA version of our Javascript URL Library. This library is available for use under the GPL.

This Javascript library facilitates the easy construction and deconstruction of URL strings by breaking the URL into it’s various components.

This library is capable or taking a URL as a string or using the current window.location and parsing it into a URL object. Any of the components of the URL can then easily be manipulated as required and the modified URL string can be retrieved. The manipulation of query string arguments is facilitated by the addArg and removeArg methods.

The download for this library includes the Javascript code, a minified copy of the code, an HTML file containing examples and test cases and license information.

The project is available here.

A brief run down of the functions/methods available in this library:

FLQ.URL - Fliquid URL building/handling class.

thisURL() - Parses the current window.location and returns a FLQ.URL object.

set() - Parses a URL and sets the properties of the FLQ.URL object.

removeArg() - Is used remove a specified argument from the FLQ.URL object arguments.

addArg() - Is used to add an argument with specified value to the FLQ.URL object arguments.

parseURL() - Parses the specified URL and returns an object containing the various components.

parseArgs() - Parses a query string and returns an object containing the parsed data.

toArgs() - Takes an object and returns a query string

toAbsolute() - Returns a string containing the absolute URL for the current FLQ.URL object.

toRelative() - Returns a string containing the relative URL for the current FLQ.URL object.

isHost() - Is used to determine whether the host in the FLQ.URL object matches the current host.

toString() - Returns a string containing the current FLQ.URL object as a URL.

Technorati Tags: Javascript,Url,Handling,Library

| Continue Reading..

A web page can load a lot faster and feel faster if the Javascripts files referenced on the page can be loaded after the visible content has been loaded and multiple Javascripts files can be batched into one download. Browsers download one external Javascript at a time and sometimes pause rendering while a script is being downloaded and executed. This makes web pages load and render slow when there are multiple external Javascript references on the page.

For every Javascript reference, browser stops downloading and processing of any other content on the page and some browsers (like IE6) pause rendering while it processes the Javascript. This gives a slow loading experience and the web page kind of gets 'stuck' frequently. As a result, a web page can only load fast when there are small number of external scripts on the page and the scripts are loaded after the visible content of the page has loaded.

Here's an example, when you visit Dropthings.com, you see a lot of Javascripts downloading. Majority of these are from the ASP.NET AJAX framework and the ASP.NET AJAX Control Toolkit project.

Figure: Many scripts downloaded on a typical ASP.NET AJAX page having ASP.NET AJAX Control Toolkit

There are total 15 javascript references on the page. As you see, browser gets stuck for 15 times as it downloads and processes all these external scripts. This makes page loading "feel" slower. The actual loading time is also pretty bad because these 15 http requests waste 15*100ms = 1500ms on the network latency inside USA. Outside USA, the latency is even higher. Asia gets about 270ms and Australia gets about 380ms latency from any server in USA. So, users outside USA wastes 4 to 6 seconds on network latency where no data is being downloaded. This is an unacceptable performance for any website.

You pay for such high number of script downloads only because you use two extenders from AJAX Control Toolkit and the UpdatePanel of ASP.NET AJAX.

If we can batch the multiple individual script calls into one call like Scripts.ashx as shown in the picture below and download several scripts together in one shot using an HTTP Handler, it saves us a lot of http connection which could be spent doing other valuable work like downloading CSS for the page to show content properly or downloading images on the page that is visible to user.

More : codeproject.com

 

Technorati Tags: asp.net,web page,javascript

| Continue Reading..