Friday, January 29, 2010

ASP.NET Controls, even the 3rd party controls are great, until you really try to use them

Over the years I have had a kind of love hate relationship with web controls and after having some frustration recently I decided to rant about it.

Conceptually it’s nice idea, the controls abstract away a lot of the “web development” so you can focus on just creating your application and not futzing around with html inputs, and creating elaborate javascript, and they give you a kind of sort of state;  and for about 90% of the time they do everything you want them to do. 

Were they fall down is really in two places:

  1. In all reality not getting that last 10% really isn’t the controls fault it’s trying to be everything to every body and you really can’t do that.  This is even true the for expensive 3rd party controls, granted vendors like DevExpress, Component One, and Telerik make some very nice controls (a lot better then the stock controls from MS) I would even say they give you an additional 5%, and for the most part they make developing web forms easier and faster, BUT they still fall down when you really push them hard and then it feels like your spending all of your time tweaking their control verses just getting your application written. 
  2. The cost of getting that statefullness by using viewstate can sometimes crush your application, like most things it’s fine in moderation, unfortunately ViewState can quickly explode in size and blot your application, creating HUGE page sizes, slow responses and if it gets big enough it starts to corrupt and your applications starts to error, fun! Once again the 3rd party vendors tend to make better controls with less viewstate.

So what is the solution, first learn about webforms controls and how they work, then create some server controls of your own.  If you look at previous posts I talk about how to create different types of controls and I’m only scratching the surface.  By rolling your own controls you can focus on getting them to do exactly what you want them to do and that might be the solution to getting the last 5% of the functionality you need.  Using controls is one of the places where it’s really easy to get started with very little knowledge and quickly get sucked under.  This is defiantly a place where if you don’t understand how it works it can and will come back to get you. 

Finally if you can’t get that last little bit of functionality, well for the most part you just have to deal with it.  Sorry to say but we are getting to a point where the development work on the web is going beyond what the underlying technology just can support. 

Monday, January 18, 2010

Unit Testing For Javascript

Recently I had to write some fairly substantial javascript, and in the process I was reminded of how fast javascript, like most scripting languages, and get out of hand really quick. I took a step back and thought why should I work in javascript any different then I do in other language? Just because it’s a scripting language doesn't make it any less valid of a development platform, and I can apply the same design pattern and principles I would with anything else.

So The first thing I did was went looking for a unit testing framework and I found JSUnit. JSUnit is available from and is a port of the JUnit framework to javascript. The entire testing framework and test runner is written in javascript so I can use it anywhere you use javascript and in any development platform(php, ruby, Perl, java, .net, etc).

Getting started I have this javascript function I want to test

   1: function addTwoNumber(x, y) {
   2:     var result = x + y;
   3:     return result;
   4: }

so first I create an html page and add the jsUnitCore.js and my .js file containing this function (almost all of your javascript really should be in .js files for a number of reasons, but that’s another blog post).

   1: <html>
   2:     <head>
   3:         <script language="JavaScript" src="jsUnitCore.js"></script>
   4:         <script language="JavaScript" src="javascriptCode.js"></script>
   5:     </head>
   6:     <body>        
   7:     </body>
   8: </html>

then to add test cases I create functions inside a script tag in the body of the html page like so

   1: <body>
   2:     <script type="text/javascript">
   3:         function test_addTwoNumber_TwoNumbersAreAdded() {
   4:             var result = addTwoNumber(2, 2);
   5:             assertEquals("Adds 2 values together", 4, result);
   6:         }
   8:     </script>
   9: </body>
to tag a function as a test, simply start the function off with the text “test” and the test runner will pick it up and run it. The assert is done with the function assertEquals provided by the jsUnitCore.js file and takes 3 prams (test description, expected value, and actual result) and to run the test you simply open the testRunner.html page in the jsunit dir in a browser


then add the file location and run the tests, it’s that simple. If you look at the screen shot you will notice that I’m using opera, for what ever reason I couldn’t get the test runner to work in Firefox, every time I would try and run my test file I would get a time out error, The funny thing is it works in IE, Chrome, and Opera just fine, weird.