Evjen bapp02.tex V2 - 01/28/2008 4:40pm Page 1586
Appendix B: ASP.NET Ultimate Tools
Figure B-3
IE WebDeveloper Toolbar and Firefox WebDeveloper
Both of these toolbars are free and absolutely essential for Web development. The IE Web Developer
Toolbar is from Microsoft and extends Internet Explorer with a docked ‘‘Explorer Bar’’ offering features
such as DOM inspection and element outlining. You can edit the CSS and see what styles are applied to
specific elements as seen in Figure B-4.
Figure B-4
Firefox has a similar but even more powerful Web Developer Toolbar created by Chris Pederick. It takes
a slightly different direction for its user interface by including a number of menus, each literally chock
full of menu options. You can disable cookies, CSS, images, inspect elements, form inputs, and outline
tables, as shown in Figure B-5.
1586
Evjen bapp02.tex V2 - 01/28/2008 4:40pm Page 1587
Appendix B: ASP.NET Ultimate Tools
Figure B-5
ASP.NET developers today need their sites to look great in both browsers. These two toolbars put a host
of usefulness at your fingertips. Highly recommended.
1587
Evjen bapp02.tex V2 - 01/28/2008 4:40pm Page 1588
Appendix B: ASP.NET Ultimate Tools
Aptana Studio — Javascript IDE
Aptana offers a pay-for Professional Edition and a Free Community Edition. It’s a Web development
environment based on the Eclipse codebase. It’s not optimized for ASP.NET, but it includes some amaz-
ing JavaScript-specific support that makes it worth looking at for AJAX or JavaScript heavy sites.
One of Aptana’s most compelling features is its understanding of browser compatibility of JavaScript
properties and functions. Aptana’s IntelliSense includes icons for the various browsers and dims them
out appropriately for unsupported features, for not only JavaScript, but also HTML and CSS, as well.
The Professional Edition also includes a JSON (JavaScript Object Notation) editor with syntax highlight-
ing for JSON datasets. This is a great feature if you’re passing a large and deep dataset back and forth via

AJAX.
Aptana also includes all the major open source AJAX libraries such as Prototype and Scriptaculous, as
shown in Figure B-6. Adding support for them simply requires checking a check box. It also integrates
with Firebug. The Pro edition integrates with Internet Explorer.
Figure B-6
1588
Evjen bapp02.tex V2 - 01/28/2008 4:40pm Page 1589
Appendix B: ASP.NET Ultimate Tools
Profilers: dotTrace or ANTS
If you’re not measuring your code with a good profiler you really don’t realize what you’re missing out
on. Only a profiler can give you extensive metrics and a clear understanding of what your code is doing.
Visual Studio Team System 2008 includes a Profiler in the top-level Analyze menu. If you’re not running
VSTS, there are excellent third party profilers such as Jetbrain’s dotTrace and Red Gate Software’s ANTS
that are worth your 10-day trial.
.NET Profilers instruments a runtime session of your code and measure how many times each line is
hit and how much time is spent executing that line, as shown in Figure B-7. They create a hierarchical
series of reports that allow you to analyze time spent not only within a method, but within child methods
executed through the stack. Reports can be saved and multiple versions can be analyzed as you improve
your applications, revision after revision.
Figure B-7
If you haven’t already done so, consider adding profiling of your ASP.NET application to your software
development lifecycle. You’d be surprised to learn how few developers formally analyze and profile their
applications. Set aside some time to profile an application that you’ve never looked at before and you’ll
be surprised how much faster it can be made using analysis from a tool such as ANTS or dotTrace.
1589
Evjen bapp02.tex V2 - 01/28/2008 4:40pm Page 1590
Appendix B: ASP.NET Ultimate Tools
References
‘‘He who lends a book is an idiot. He who returns the book is more of an idiot.’’ — Anonymous, Arabic
Proverb

PositionIsEverything.net, QuirksMode.org,
and HTMLDog.com
When you’re creating Web sites that need to look nice on all browsers, you’re bound to bump into bugs,
‘‘features,’’ and general differences in the popular browsers. Web pages are composed of a large com-
bination of standards (HTML, CSS, JS). These standards are not only open to interpretation, but their
implementations can differ in subtle ways, especially when they interact.
Reference Web sites, such as PositionIsEverything and QuirksMode, collect hundreds of these hacks and
workarounds. Then they catalog them for your benefit. Many of these features aren’t designed, but rather
discoveredorstumbledupon.
HTMLDog is a fantastic Web designer’s resource for HTML and CSS. It’s full of tutorials, articles, and a
large reference section specific to XHTML. QuirksMode includes many resources for learning JavaScript
and CSS and includes many test and demo pages demonstrating the quirks. PositionIsEverything is
hosted by John and Holly Bergevin and showcases some of the most obscure bugs and browser oddities
with demo examples for everything.
Visibone
Visibone is known for its amazing reference cards and charts that showcase Color, Fonts, HTML,
JavaScript, and CSS. Visibone reference cards and booklets are available online and are very reasonably
priced. The best value is the Browser Book available at
www.visibone.com/products/browserbook.html
.
I recommend the laminated version. Be sure to put your name on it because your co-workers will make
it disappear.
www.asp.net
I work for Microsoft on the team that runs
www.asp.net
. The site is a huge resource for learning about
ASP.NET and the various technologies around it. Figure B-8 shown part of the Community page for
the site, where you’ll a link to my Weblog, among others, and links to other community resources. The
www.asp.net/learn/
section includes dozens and dozens of videos about general ASP.NET and how to

use it.
1590
Evjen bapp02.tex V2 - 01/28/2008 4:40pm Page 1591
Appendix B: ASP.NET Ultimate Tools
Figure B-8
Tidying Up Your Code
‘‘After every war someone has to tidy up.’’ — Wislawa Szymborska
Refactor! for ASP.NET from Devexpress
Refactoring support in Visual Studio 2008 continues to get better. The third party utilities continue to
push the envelope adding value to the IDE. Refactor! for ASP.NET adds refactoring to the ASP.NET
source view.
For example, in Figure B-9 while hovering over the Refactor! context menu and selecting the ‘‘Extract
UserControl’’ refactoring, a preview of the changes that would be made appear within the source view.
A new UserControl would be created in a new file
WebUserControl0.ascx
. The currently selected label
control would turn into a
WebUserControl0
control. You can then choose a new name for the UserControl
immediately after the refactoring.
The most amazing thing about Refactor! for ASP.NET is that it’s a free download from
www.devexpress.com/Products/NET/IDETools/RefactorASP/
. It includes 28 refactorings that make it
easier to simplify your code and your ASP.NET markup.
1591
Evjen bapp02.tex V2 - 01/28/2008 4:40pm Page 1592
Appendix B: ASP.NET Ultimate Tools
Figure B-9
Code Style Enforcer
Code Style Enforcer from Joel Fjord

´
en does just that. It’s a DXCore Plugin that enforces code style rules
that you configure. DXCore is the free engine from DevExpress that Refactor! uses to extend Visual
Studio.
Every team has a coding standard that they’d like programmers to follow, but it’s not only hard to keep
track of all the rules, it’s tedious. Are methods supposed to be CamelCased or pascalCased? Are we
putting ‘‘m_’’ in front of member fields?
Code Style Enforcer is a lot like Microsoft Word’s spelling and grammar checker except for code. As
shown in Figure B-10, identifiers that do not meet the code style guidelines are underlined in red. You
can right-click on each error and Code Style Enforcer will use DxCore to refactor and fix each violation.
Style guidelines are configurable and the default uses Juval Lowy’s excellent C# Code Style Guidelines
available from
www.idesign.net
. The latest version will also generate code rule violation reports for a
solution using XML and XSLT providing customizable different templates. Code Style Enforcer is an
excellent tool to add to your team’s toolbox.
1592
Evjen bapp02.tex V2 - 01/28/2008 4:40pm Page 1593
Appendix B: ASP.NET Ultimate Tools
Figure B-10
Packer for .NET — Javascript Minimizer
When creating an ASP.NET Web site, you often find yourself creating custom JavaScript files. During
development, you want these files to be commented and easy to read. During production, however,
every byte counts and it’s nice to reduce the size of your JavaScript files with a JavaScript ‘‘minimizer.’’
Packer for .NET is a C# application that offers compression of JavaScript or simple ‘‘minification’’ by
stripping comments and white space.
You’d be surprised how well these techniques work. For example, Steve Kallestad reported that a copy of
the JavaScript library Prototype 1.50 was 70K before JavaScript-specific compression. It became 30K after
the process, and then reached only 14K when gzip HTTP compression was applied. From 70K to 14K is a
pretty significant savings.

JavaScript-specific compression does things such as renaming variables to single letters, being aware of
global variable renaming vs. local variable renaming, as well as stripping unnecessary white space and
comments.
1593
Evjen bapp02.tex V2 - 01/28/2008 4:40pm Page 1594
Appendix B: ASP.NET Ultimate Tools
Packer includes utilities for compression at both the command line and within MSBuild projects. The
MSBuild targets can be added to your build process. Consequently, your integration server is continuous
so you receive these benefits automatically and unobtrusively.
As an example, a JavaScript library might start out looking like this:
var Prototype = {
Version: ’1.5.0’,
BrowserFeatures: {
XPath: !!document.evaluate
},
ScriptFragment: ’(?:
<
script.*?
>
)((
\
n|
\
r|.)*?)(?:
<\
/script
>
)’,
emptyFunction: function() {},
K: function(x) { return x }

}
Packed, the JavaScript might end up looking like this (as an example) but it will still work!
(c(){f 7.2q(/
<\\
/?[^
>
]+
>
/5a,"")}),2C:(c(){f 7.2q(P
5d(1m.5s,"9n"),"")}),9j:(c(){k 9m=P 5d(1m.5s,"9n");k 9k=P
5d(1m.5s,"ce");f(7.E(9m)||[]).1F((c(9l){f(9l.E(9k)||["",""])[1]}))}),3P
:(c(){f 7.9j().1F((c(4s){f 6A(4s)}))}),cd:(c(){k 1h=N.4f("1h");k
2V=N.cc(7);1h.63(2V);f 1h.2P}),cb:(c(){k 1h=N.4f("1h");1h.2P=7.9i();f
1h.2O[0]?(1h.2O.o
>
1?$A(1h.2O).2A("",(c(3Y,1G){f
3Y+1G.4j})):1h.2O[0].4j):""}),6J:(c(9h){k
E=7.4d().E(/([^?#]*)(#.*)?$/);h(!E){f{}}f
E[1].3m(9h||"&").2A({},(c(2E,Q){h((Q=Q.3m("="))[0]){k v=9g(Q[0]);k
l=Q[1]?9g(Q[1]):1b;h(2E[v]!==1b){h(2E[v].3k!=1M){2E[v]=[2E[v
>
}h(l){2E
[v].M(l)}}1k{2E[v]=l}}f 2E}))}),2F:(c(){f 7.3m("")})
There are many JavaScript minimizing libraries available; this is just one of them. However, it’s options,
completeness, and integration with MSBuild that make Packer for .NET worth trying out.
Visual Studio Add-ins
‘‘If I had eight hours to chop down a tree, I’d spend six sharpening my axe.’’ — Abraham Lincoln
1594
Evjen bapp02.tex V2 - 01/28/2008 4:40pm Page 1595
Appendix B: ASP.NET Ultimate Tools

ASPX Edit Helper Add-In for Visual Studio
Sometimes an add-in does something so small and so simple that you might dismiss it at first glance. But
when you find yourself doing the same action over and over again, you’ll be thankful for the ingenuity
of developers who create time savers like this little gem.
The ASPX Edit Helper does two things, and it does them well. Not everyone likes to use the visual
designer in Visual Studio 2008. Some users prefer to type ASPX mark-up directly in the source view. This
add-in automatically fills in
"runat="server"
and
id="randomid"
when you type a server control. It also
includes short codes for automatic insertion of snippets.
For example, if you type
/lbl
and press Enter, you’ll get:
<
asp:Label runat="server" id="lbl5394" Text="" /
>
A nice touch is that the cursor will be automatically positioned within the id attribute in the random ID
selected so you can immediately begin typing a new ID for the control. This thoughtful design will allow
you to create complicated forms with minimal typing very quickly. Figure B-11 shows the moment just
before I press Enter after typing the
/txt
short code.
Figure B-11
Installation is easy. Just unzip into your Visual Studio Add-ins folder. As an aside, the authors also
include source code, which is useful if you’re interested in writing your own Add-in.
1595