Adding a friendly splash (waiting screen) while the code is being executed in ASP

Posted by Arkan Hadi on Aug 25, 2008 in Development, English | 4 comments

Nowadays, most websites are connected to databases. the larger the data in the database, the longer it takes for the browser (or the code) to fetch/retrieve the required data for the user. and ofcourse, that’s where the developers’ skills comes handy, where developing an efficient code and using the minimum queries as possible is a must. i would like to add that having a little data in the database is not an excuse for not developing an efficient code for retrieving information from databases.

now, i assume that you “developers” did the most efficient way to retrieve the data, but above that there is still a considerable “fetching” time to wait inorder to fully display the records queried, here comes the benefit of adding a splash screen for the user, so he/she doesn’t panic and think that the page is stuck or something.

easy steps to follow inorder to get an attractive waiting screen (see below) while the code is processing and the user is waiting:

first of all you need to add one important line of code to the top of your ASP page, that line is:

<%Response.Buffer = True%>

This line tells the server not to send anything to the client until the page is finished processing or you use “Response.Flush” code in part of your ASP page to send everything fully loaded so far.

now just add the following to javascript functions to your code between “script” tags, those functions are used to “show” and “hide” the splash screen when needed:

function showObj(obj){obj.style.visibility = "visible";}

function hideObj(obj)

{obj.style.visibility = "hidden";}

now after we created the functions we create the part that gonna show as “splash” screen, i created it as “div” as it can contain more then one element inside it not just an animated image or text..

  <div id="splashScreen" style="position:absolute;z-index:5;align:center;">           Searching, please wait .. <br>          <img src="loada.gif"/>

  </div>

its strongly recommended to put this div as close as possible to the nearest element after you invoke a “search” button or a “submit” button so the div would show as soon as the “fetching” face starts

you can put any animated “gif” pic in the img src, i choose to put a loading indicator, you can find a very nice collection of activity indicators from http://www.ajaxload.info/

after you put the div in the right position, you should put the “Response.Flush” code so you tell the browser to show to the user everything loaded so far “including the splash screen” and then do the processing, code executing and searching. after that you do “Response.Flush” again to show the information fetched, and finally you hide the “splash screen” .. so to make it simple, your code would be like the following:

<%..Response.Flush  'this will show everything loaded so far including the splash screen.'... put the searching/fetching code here and show the results ...'... remember that your results wont show until you flush again ....Response.Flush  'this will show everything so far including splash screen AND results

%>

and after we finished from everything we hide the “splash” screen with the following command (put the command in javascript script tag)

var splashsplash = document.getElementById("splashScreen");hideObj(splash);

remember that you can customize the splash to your liking, after all its a div and can be pretty flexible.

Increasing performance and adding flexibility using arrays instead of recordsets in ASP with databases

Posted by Arkan Hadi on Aug 21, 2008 in Development, English | 0 comments

Those days, inorder to increase the websites/intranets features and interactivity it is essential to have a connectivity to a database wither its an oracle database or MS access or other types of databases, .. and with databases comes the issue of performance, so in this article i would like to share some of the things that a developer can do to maintain a reasonable performance and even adding more flexibility to the ASP code dealing with databases that has huge data that needs to be fetched.

in this article am using vbscript as a server-side script.

for convenience i will show the steps on how to connect to MS access database first and after that i will start on the tweaks that developers can do in the coding to enhance performance and adding flexibility

<%

dim conn

set conn=Server.CreateObject(“ADODB.Connection”)

conn.Provider=”Microsoft.Jet.OLEDB.4.0″

conn.Open “c:YOUR_DATABASENAME.mdb”

%>

first of all, after you set up a connectivity to the database, you create a query, for example:

<%

dim rs ‘recored set

set rs=Server.CreateObject(“ADODB.recordset”)

rs.Open “Select * from TABLE_NAME”, conn

%>

at this point not much can be done, connecting to the database and querying to get data is pretty much fixed.

the thing start when manipulating the data we just fetched, most of the people do is manipulating the data like the following code

<%

do while not rs.EOF

‘ manipulate data here, go through the query exucuted, movenext, movelast move previous, etc

response.write(rs(“FIELD_NAME”))

rs.MoveNext

loop

rs.Close

conn.Close

set rs=nothing

set conn=nothing

%>

the above code would work perfectly if you have to deal with one query, relatively small data set in the query, and only small code is used to manipulate the recordset, and as long as you want to deal with the data (in the above code) the recordset should stay open .. what if we wanted to do a new query while we are dealing with the existing one while it is still not closed? .. we would have to create another record set and set it and open connection to it, and this would make a nightmare interms of performance if we have a larg data and multiple quieries to deal with. to avoid this we can copy the query information to a multi-dimensional array and close the recordset so we can use it again while we are working with the existing data. instead of doing the previous code we can do the following code:

<%

dim rsArray

next

conn.Close

set rs=nothing

set conn=nothing

%>

after we fetched the information we needed into “rsArray” we finished from the record set and we closed it “rs.close” so we can use it later while dealing with the existing data without having to create a new recordset. now while we have a multi dimensional array in our hand, we can take advantage of that to our benefit, even we can redim it if we want to add new columns or rows, but when redim-ing the data is lost, so we have to use “preserve” keyword to preserve the data after rediming, for example if we have number of rows and we want to add a new one we do the following code



<%

.

.

.

dim cols

redim preserve rsArray(cols,rows+1) ‘ we have extra row

%>

notice the preserve keyword only works when redim-ing the last dimension, if we want to redim the first one (or the second one or third if we have more then 2) we have to go around it, copying the array to another array and put the dimension we want to change in the last place, and then we can use the “redim preserve” and work with the temp. array.

As a conclusion, using the actual record sets while manipulating data and creating new ones whenever we need is not efficient, on the other hand knowing the features of the arrays we can use it to our advantage so dealing with arrays is more flexible and more efficient then the actual record set.