Friday, August 22, 2008

FYI: I'm changing my feed URL

I just wanted to give my RSS people a heads up. Some time in the next few months I will be shutting down my old feed URL.

My new URL is:
http://feeds.feedburner.com/JustinKohnen

Please switch over when you get a chance. I'd hate to lose you as a reader.

Kindest Regards,
Justin Kohnen, Geek

Monday, August 11, 2008

When do browsers download images defined in Cascading Style Sheets?

Just the other day I was talking with a coworker about ASP.NET Themes. We were addressing a question about putting multiple Cascading Style Sheets (CSS) into a theme.

Unless you do something special, ASP.NET Themes adds a link reference to every CSS file in the theme directory. We were fine with this behavior even if the styles weren't used by the page, but what about all the background images defined in the style sheets?

Here's where we asked the question "When do browsers download images defined in Cascading Style Sheets?"

Here are my findings:

Both Internet Explorer 7 and FireFox 3.0 do not download an image unless the style is used on an element of the page.

For Example:

Consider a style sheet called style.css which containes

.image
{
 background:transparent url(testImage.png);
}

If you have a html file which contains:

<html>
    <head>
        <link type="text/css" rel="stylesheet" media="screen, projection" href="style.css">
    </head>
    <body>
        <p>Hello World</p>
    </body>
</html>

There will be two requests to the server: html, and css

If you have a html file which contains:

<html>
    <head>
        <link type="text/css" rel="stylesheet" media="screen, projection" href="style.css">
    </head>
    <body class="image">
        <p>Hello World</p>
    </body>
</html>

There will be three requests to the server: html, css, and png

I tested using FireFox 3.0 with FireBug (HEH HEH, FIRE!), and Internet Explorer 7 and Fiddler.

Friday, August 8, 2008

ASP.NET Development Tips/Tricks: Using "Attach to Process..."

I wanted to save this tip for later but I think it's too important to hold back. The one action of attaching to a process will save you minutes, that's right MINUTES, in your daily tasks.

You might have noticed in my last post about Keyboard Shortcuts I never mentioned the F5 key. That's because I never use it.

The F5 key is commonly used to "Start Debugging." Let's take a moment to walk thru what happens when you press F5. (Or click the green play button, or thru the menu Debug > Start Debugging)

2008-08-08_2244The F5 Way

  1. First, Visual Studio (VS) will build your startup project.
  2. Second, VS opens an instance of your configured browser and attaches to the browser's process.
  3. Third, VS will direct the browser to the start page of your start-up project.
  4. Forth, VS finally attaches to the process hosting ASP.NET
    1. w3wp.exe if you use IIS6
    2. aspnetwp.exe if you used IIS 5.5
    3. WebDev.WebServer.exe if you use the ASP.NET Development Server that comes with Visual Studio.

Now, lets assume you want to debug some new administrative feature you've added to your web application. After all of the "F5" steps, most likely you:

  1. Fifth, start on your start page (I'll assume Default.aspx)
  2. Sixth, click on the Login link
  3. Seventh, login with Username and Password
  4. Eighth, browse to the Administration page with the feature you want to test

Now, lets assume you have a bug in your code.  Your next step might be:

  1. Ninth, close the browser
  2. Tenth, change the code to fix the bug
  3. Goto First

The "Attach to Process..." Wayatp 

So, how can "Attach to process... " save you minutes? By not repeating the Second, Third, Fifth, Sixth, Seventh, Eighth, and Ninth steps from above.

Here is the process I use:

Once per day:

  1. Open Browser
  2. Browse to development website
    1. If Root: (http://localhost)
    2. If Virtual Directory: (http://localhost/vDirectory)
  3. Click Login link
  4. Login with Username and Password
  5. Browse to the Administration page where the new feature will be

That's right, I usually only do these 5 steps once a day.

Now, I write my new administrative feature. Then, it comes time to test my changes.

<note>
This is where my first three common "walks" of my last post become important.
</note>

  1. First, build the current web project if needed.
    1. (Alt, B, U)
  2. Second, attach to process hosting ASP.NET.
    1. w3wp.exe (Alt, D, P, W 3, Enter)
    2. aspnetwp.exe (Alt, D, P, A S P, Enter)
    3. WebDev.WebServer.exe (Alt, D, P, W E B, Enter)
  3. Third, switch to the open browser
    1. (Alt+Tab)
  4. Fourth, refresh page as appropriate
    1. (F5 or Ctrl+F5 or Alt+D, Enter)

Lets assume there is a bug in my new code. (I know it's hard to believe, but just for giggles lets assume.)

  1. Fifth, detach from the process hosting ASP.NET
    1. (Alt, D, D, [sometimes Enter])
  2. Sixth, change the code to fix the bug
  3. Goto First

Conclusion

By using "Attach to Process..." we save ourselves repeatedly launching and closing the browser, the login process, and the preliminary navigational steps to get to the code we want to test. These actions which took minutes and were repeated with every "F5" now are only done once.

Wednesday, August 6, 2008

For the lovers of techno and "The Orange Box: Portal"

I'm a developer that cannot code without music. Euro Dance Techno from di.fm is this ninja's weapon of choice. I don't think I could work for a company that didn't let me have my headphones.

Just the other day I can across a remix of "Still Alive" from the credits of "Portal" the video game. (Part of The Orange Box).

I wanted to give a shout out to Raddox for his mix, and let others know about some of his other awesome work. Namely, "I'll Follow You There," and the amazing "When I Was a Child."

Happy coding to all.

Monday, August 4, 2008

ASP.NET Development Tips/Tricks : Know your Keyboard

I've thought for a while about what tip I wanted to start with. I decided to begin with the keyboard because I'll mention what shortcuts I use in all future tricks.

I don't want to get into a debate of which is better "the keyboard" or "the mouse", (personally I use one to compliment the other) but there are a some things about your keyboard and Visual Studio (VS) that can shave a few seconds off your common daily tasks. I like to call these two tips "VS Keyboard Shortcuts" and "Walking the Menus."

VS Keyboard Shortcuts

Everyone should know Visual Studio IDE largely relies on the Command Pattern. Nearly every action in VS can be performed by a command, and most Add-ins rely on the command pattern too.

What does this give us? Two words: "Keyboard" "Shortcuts." You can essentially tie any command (save, build, copy) to a key combination.  These settings are controlled in the keyboard options dialog.

Tools > Options > Environment > Keyboard

2008-07-30_1911

In this dialog you can lookup all the commands, and assign key combinations to them.

If you see a command with a comma (',') in it, this means you pause.

For example "Ctrl+K, Ctrl+K" means hit "Ctrl+K" pause hit "Ctrl+K" again. Or, hold down the "Ctrl" key and hit the "K" key twice.

Some of the most common VS shortcuts I use are:

Ctrl+X Cut
Ctrl+C Copy
Ctrl+V Paste
Ctrl+Z Undo
Ctrl+Shift+Z Redo
Ctrl+S Save
Ctrl+G Go to line
Ctrl+Shift+B Build Entire Solution
Ctrl+K, Ctrl+K Add/Remove Bookmark
Ctrl+K, Ctrl+P Go to Previous Bookmark
Ctrl+K, Ctrl+N Go to Next Bookmark
Ctrl+M, Ctrl+O Collapse all (regions, methods, etc.)
Ctrl+M, Ctrl+P Expand All (regions, methods, etc.)
Ctrl+M, Ctrl+M Collapse/Expand Current
Ctrl+K, Ctrl+C Comment out Current Line or Selection
Ctrl+K, Ctrl+U Uncomment Current Line or Selection
F9 Add/Remove a breakpoint on the current line

Most of the common commands appear in the menus for quick reference.

2008-07-31_1830

Some general non-VS shortcuts I also use:

Alt+Tab Switch windows.
Ctrl+Right Arrow Jump one "word" to the right
Ctrl+Left Arrow Jump one "word" to the left
Ctrl+Shift+Right Arrow Un/Highlight one "word" to the right
Ctrl+Shift+Left Arrow Un/Highlight one "word" to the left

 

Walking the Menus

2008-08-04_1855Now, spend a few minutes exploring your menus and context menus. Look at all those commands and command categories. (Most having an underlined letter)

Using your Alt key and those underlined letters you can "walk the menus."

When you hit Alt, the menu bar gets focus. Use the letter shortcuts (the underlined letter) to select the action you want. This keeps you from taking your hands off your keyboard to grab the mouse to click the menus.

Some of my common "walks" are:

Alt, B, U Build Current Project (the project containing the document your working on)
Alt, D, P Attach the VS Debugger to a Process
Alt, D, D Detach the VS Debugger from all Processes
Alt, W, L Close all Documents/Tabs

The first three don't seem like much, but I'll explain how valuable they are in a later post.

Conclusion

The process of taking your hand off your keyboard home row, grabbing the mouse, dragging to target, clicking (repeated clicking if you have bad aim), and moving your hand back to the home row takes valuable seconds. Why not save them by learning a keyboard trick or two?