Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

This is the fifth in a series of blog posts I’m doing on the upcoming VS 2010 and .NET 4 release.

Today’s post covers a new “Web Development (Code Optimized)” profile option we are introducing with VS 2010 that allows you to optionally configure Visual Studio to run in an IDE layout mode that hides the WYSIWYG web designer and instead optimizes around a rich “source editing focused” tooling experience.

VS 2010 Web Profiles

When you first run VS 2010 it prompts you to select an IDE profile to use.  The profile you select will configure how tool windows are displayed/docked in the IDE by default and set the default keyboard shortcuts.  You can then customize any of these settings by using the Tools->Options menu within the IDE and then override/change them.  You can also later reset your profile and pick a different one by choosing the Tools->Import and Export Settings menu command.

One of the things you’ll notice when you run VS 2010 Beta2 for the first time is the inclusion of two “Web Development” profiles in the list of options:

0 Choose Default Environment Settings

The first “Web Development” profile option is an evolution of the existing web development profile option from VS 2008 (with some nice improvements that help improve screen real estate usage with VS 2010).  It also allows you to take advantage of all the great WYSIWYG HTML and ASP.NET Page designer improvements we’ve done with the VS 2010 release (I’ll cover these in more detail in later blog posts in this series).

The second “Web Development (Code Optimized)” profile option is a new profile we are introducing with VS 2010 that is optimized for web developers who do not want to use a WYSIWYG designer when doing their web development, and who prefer a “source only” editing experience when working on pages.  This IDE profile option hides the WYWISYG page designer tabs, and configures a default IDE layout that maximizes the amount of code that is displayed on the screen (with a minimum of toolbars and tool windows).  It still provides a full intellisense/debugging and source editor experience for pages.

Comparing the VS 2010 Web Development Profiles

You can get a sense of the difference between the two profiles by comparing screen-shots of the Visual Studio IDE layout immediately after the two different “Web Development” profiles are applied:

Screenshot of the “Web Development” Profile:

The layout below demonstrates the default IDE layout (at a 750x650 monitor resolution) when the standard “Web Development” profile is applied.  This profile is an evolution of the existing “Web Development” profile in VS 2008 and exposes design/split/source tabs within the document window of any HTML or ASP.NET page:

1 Old Profile Small IDE

Screenshot of the “Web Development (Code Optimized)” Profile:

The screen-shot below demonstrates the default IDE layout (at a 750x650 monitor resolution) when the new “Web Development (Code Optimized)” profile is applied.  As you can see, the profile optimizes the screen real estate around displaying and editing code on the screen, hides all toolbars by default, and disables and hides the designer tabs within the document windows of HTML and ASP.NET pages:

2 New Profile Small IDE

Below is a screen-shot of the “code optimized” profile at a larger monitor resolution:

2 New Profile Full IDE Single File

Mixing and Matching Features

All of the different features used in both the standard “Web Development” profile and the “Web Development (code optimized)” profile are exposed via Visual Studio’s Tools->Options configuration dialog.  This means that you can start with any of the VS profiles (including the General, VB and C# profiles) and turn on or off individual features to customize the IDE layout and editing experience however you want it to be.

For example: below you can see the Tools->Options dialog checkbox to enable or disable the HTML designer (which will configure whether the Design/Split/Source tabs are shown at the bottom of each page):

0 Tools Options HTML Designer

This gives you the flexibility to customize your development experience however you want and create a personalized tooling experience optimized for you and your preferred way of doing development.

The two web development profiles that ship in the box provide two good preconfigured starting points that we think offer a nice set of defaults for a large set of the web developers out there.  You can easily choose to start with whichever one feels best to you, and optionally configure them further however you want.

Summary

We are offering the new profile simply as an option for those who prefer a source-focused web development experience. The WYSIWYG HTML/ASP.NET designer continues to be enabled by default with all the other VS 2010 profiles (just like it does with VS 2008), and we have also made a lot of improvements to it with the VS 2010 release (I’ll blog more details about these in later posts).  So don’t worry – the WYSIWYG designer definitely isn’t going away, and will continue to be enhanced and improved with each release. 

We think the new “Web Development (Code Optimized)” profile, though, is a nice new option for developers who prefer a “source editing focused” web development experience, and who do not use the WYSIWYG designer.  The profile option provides an easy way for them to hide the designer (along with its associated tool windows and toolbars) from the IDE layout and instead use a source-focused web development experience.

Hope this helps,

Scott

P.S. In addition to blogging, I have been using Twitter more recently to-do quick posts and share links.  You can follow me on Twitter at: http://www.twitter.com/scottgu (@scottgu is my twitter name)

Published Wednesday, September 2, 2009 12:55 AM by ScottGu

Comments

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Wednesday, September 2, 2009 4:10 AM by Andrei Rinea

How does this differ from full-screen (ALT-SHIFT-ENTER)? Seems quite the same..

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Wednesday, September 2, 2009 4:25 AM by Dean Thomas

Fantastic!

There's nothing i dislike more than design view to be honest, it's slow, clunky and when you open it in design by accident it takes about a week to load up.

Thanks for making my life that little easier!

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Wednesday, September 2, 2009 4:26 AM by Chris

Love the article Scott.. Keep em coming :)

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Wednesday, September 2, 2009 4:38 AM by Simone Chiaretta

Great... disabling the Designer button is what I was looking for since... ever.

I never used the designer view, and when I clicked the button by mistake it took ages for VS to become responsive again. So, no button, no more clicking on it by mistake and waiting 30secs before being able to use VS again.

Tiny but very useful feature!!

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Wednesday, September 2, 2009 4:47 AM by Chad

Awesome news for those of work that work in code only mode. Which I'm pretty sure is 100% of developers anyway.

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Wednesday, September 2, 2009 5:15 AM by Sweden

SWEET! The design view will not be missed.

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Wednesday, September 2, 2009 5:52 AM by vik20000in

Is there  a way to change the profile after once you have selected it in the beginning. And No I do Not want to change them manually one by one for all option. I just want to select a different profile. This is a common requirement as I might work on a Windows application some time and On the same box after a few weeks/ months work on a web application. Is there a simple way to select and change the profile of VS then?

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Wednesday, September 2, 2009 6:24 AM by Jesper Hauge

That's great - I am one the Code-optimized kind of developers. But I use the design view for one thing, and one thing only. I can never remember the exact method signature for the different server side events on controls, so when I need to create one of those I switch to design view (since the events arent accessible in the Properties pane when in source view), and double click the event I'm interested in, to have a method with the right signature inserted in the code-behind file.

So what I'm now really interested in is: Does the Code optimized view sport som kind of feature that helps me wire up the different control events with methods with the correct signature?

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Wednesday, September 2, 2009 6:29 AM by Alex Angas

Really like having the "text editing"-related toolbars off in the new profile. I'm always turning those flipping things off after a new install. Each different file type popped up a different one which led to an inconsistent user experience.

Thanks for paying attention to those little niggling details that altogether make for a sub-standard experience. Looking forward to trying out Beta 2!

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Wednesday, September 2, 2009 6:36 AM by Elangovan

Nice feature. I always wanted this. Is the same thing is implemented for all design views? Mainly can we disable WPF design view ?

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Wednesday, September 2, 2009 7:34 AM by Demis

I seriously consider this is a very important feature as it also includes a mindset change. Many pro-developers like myself never touch a designer and hate it when we accidentally press the wrong key, goes into designer-mode and reformats all our code.

I consider VS.NET the best IDE for both newbie's and pro developers, and there has been a lot of effort to make it as simple as possible to develop with a lot of point-and-click programming. Having a pro-user mode will be awesome as it will make the IDE better (and hopefully perform quicker) for pro-developers.

What I would be interested in though, is what your relationship with ReSharper is like (VS.NET would not nearly be as good without it) but it still looks like its just an advanced plug-in that duplicates (imho greatly improves) a lot of VS.NET functionality.

Having multiple ways to achieve the same thing complicates the UI (and probably slows it down too). I'm not sure what your efforts in this area is, but it would be nice if there was a 'optimized for ReSharper' option as well. As we could remove a lot of duplicated functionality we don't need.

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Wednesday, September 2, 2009 8:08 AM by Dan Dumitru

I think 90% of developers don't even mind opening the Design View.

Not even the people from our HTML/CSS department are using it.

And I don't think the Design View will ever be useful for anyone but the newbies. Too many possibilities to reference CSS files (including dynamic loading of CSS files and Master Pages).

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Wednesday, September 2, 2009 8:59 AM by Ryan

The real question is, when will Beta 2 be available?  Beta 1 is not very stable and is extremely tough to use for more then a few hours without crashing.  Working with a project that's already committed to .NET 4.0, we're dieing for a new beta release of Visual Studio.  Since you are discussing a feature new to Beta 2, does that mean the release is imminent?

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Wednesday, September 2, 2009 10:28 AM by herzevekil

Thanks for your useful article

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Wednesday, September 2, 2009 10:31 AM by David Nelson

It seems like this is addressing the problem the wrong way. I very often want to work in the design on one page and without it on another. Changing a global option every single time I open a file isn't really very helpful. Isn't there a way to choose whether I want the designer when I open the file?

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Wednesday, September 2, 2009 10:32 AM by Aaron R

Will there be a similar option for XAML development?   One of the first things I do on a fresh 2008 install is switch the XAML opening default to be "Source Code (Text) Editor" because the designer is so useless and slow.   While I'm sure the designer has been improved in 2010,  it'd still be nice to have a "code optimized XAML" option as well.  (Though I guess I could just switch the default opening like I do in 2008.)

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Wednesday, September 2, 2009 10:36 AM by ccatto

Hey Now Scott,

Nice Post!

Thx 4 the info,

Catto

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Wednesday, September 2, 2009 11:14 AM by JonW

Screenestate:

Love that you guys take this on this "mission" :D !

(with profile solutions and multiple monitors)

I like to "hack" vs 2008 to behave like I want it to :)

I use Winsplit revolution, with this wonderful program I can do things with VS. (and other programs) that utilizes my screen estate to a fuller extent.

Some examples:

Like the feature "Web Development (Code Optimized)”" in vs2010 I can do practicly the same with Full screen mode in vs 2008 (or before)

IN fullscreen mode I can with winsplit tile VS workspace with other windows so that it is in fullscreen-mode even though it's not fullscreen :) (tada => like the profile "code otpimized" )

; the wonderful thing with fullscreen mode is that I can quit fullscreen mode and have all sidebars in the same state I left them.

The same winsplit-solution can be applied to the (in my opinion) much hated "wizards"-dialogs that are far to small and in my opinion none large screen or purpose optimized.

With Winsplit I can change the size layout directly with my keyboard, without having to resort to mouse resize:ing of the window.

For example "Add new item" - option triggers a wizard that look MUCH more nicer and more eye/information scan friendly if it's

full screen height with 2 to 3 items in a row.

CTRL + left arrow + left arrow gives me this more optimised view thanks to winsplit.

// Hopes this feedback triggers other people and you guys to get new ideas to produce an even more user friendly, highly productive and more intuitive product. Thanx :)

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Wednesday, September 2, 2009 11:14 AM by JC

Great feature - I'd like to see more of this across the board, for example a "Code Focused" WPF/Silverlight profile would be very welcome, not just for those who don't use designers but also for those of us that have Blend open in the other monitor and want a faster, leaner VS experience.

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Wednesday, September 2, 2009 11:51 AM by vn_nilesh@hotmail.com

hi Scott,

I wonder where do you get these wonderful posts from. its such a pleasure to read you articles. keep posting.

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Wednesday, September 2, 2009 12:16 PM by Charles Boyung

re: Andrei Rinea -

The difference is that the designer is not there at all.  This is absolutely huge because that designer is quite the resource hog and as someone else mentioned, a large time sink if you hit it by accident.

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Wednesday, September 2, 2009 12:26 PM by Harshil Patel

I only use the designer for one purpose, generating the events for the server side control because i dont remember all the event signatures. Some times the events are shown in the property pane when i am in the code view mode, but it happens only rarely (think its a VS bug) so i have to go to the designer, which takes about months to load ( i can switch multiple jobs between that time).

Is there any way to resolve the bug regarding showing of the events when we are in the codeview on the properties pane ?

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Wednesday, September 2, 2009 4:37 PM by mike

did not see this coming, nice surprise, but a minor thing. How about a post about how (if) C# 4.0 can be used in web apps?

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Wednesday, September 2, 2009 8:50 PM by Webdieyr

Nice feature!do you have any idea when will vs2010 beta 2 and rc be released

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Thursday, September 3, 2009 2:43 AM by Rasel Jabbar

Nice! Thank God for Visual Studio! VS2010 is looking really good....hopefully XAML editing/ Silverlight development will be more stable and performant in Beta 2.

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Thursday, September 3, 2009 3:12 AM by ScottGu

@vik2000in,

>>>>>>> Is there  a way to change the profile after once you have selected it in the beginning. And No I do Not want to change them manually one by one for all option. I just want to select a different profile. This is a common requirement as I might work on a Windows application some time and On the same box after a few weeks/ months work on a web application. Is there a simple way to select and change the profile of VS then?

Yes - you can change your profile at any time by choosing the "Tools->Import and Export Settings" menu command.  This allows you to choose any of the built-in profiles, and/or save/import a custom one you've created.

Hope this helps,

Scott

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Thursday, September 3, 2009 3:14 AM by ScottGu

@Jesper,

>>>>>> But I use the design view for one thing, and one thing only. I can never remember the exact method signature for the different server side events on controls, so when I need to create one of those I switch to design view (since the events arent accessible in the Properties pane when in source view),

Unfortunately there isn't automatic support for wiring up server events in HTML source mode (unlike the XAML editor - which has a nifty way of doing this purely via source).  I'm hoping we can enable this in a future update/refresh post the VS10 release though.

Hope this helps,

Scott

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Thursday, September 3, 2009 3:20 AM by ScottGu

@Demis,

>>>>>>> What I would be interested in though, is what your relationship with ReSharper is like (VS.NET would not nearly be as good without it) but it still looks like its just an advanced plug-in that duplicates (imho greatly improves) a lot of VS.NET functionality. Having multiple ways to achieve the same thing complicates the UI (and probably slows it down too). I'm not sure what your efforts in this area is, but it would be nice if there was a 'optimized for ReSharper' option as well. As we could remove a lot of duplicated functionality we don't need.

We work pretty closely with vendors like Resharper (I believe they've been working with VS10 for over a year now).  

VS10 does have much richer code authoring features that I'll cover in later posts.  Some of these features do provide capabilities that are only in plugins like Resharper today.  We now have an even richer extensibility system in VS10, though, so there are plenty of good opportunities for Resharper and others to provide a lot of additional value.

Hope this helps,

Scott

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Thursday, September 3, 2009 3:21 AM by ScottGu

@Ryan,

>>>>>>> The real question is, when will Beta 2 be available?  Beta 1 is not very stable and is extremely tough to use for more then a few hours without crashing.  Working with a project that's already committed to .NET 4.0, we're dieing for a new beta release of Visual Studio.  Since you are discussing a feature new to Beta 2, does that mean the release is imminent?

We are getting closer to Beta2.  There are so many new features I wanted to discuss - which is why I started this blog series early (I have a lot more posts to go <g>).

Hope this helps,

Scott

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Thursday, September 3, 2009 3:26 AM by ScottGu

@David,

>>>>>>> I very often want to work in the design on one page and without it on another. Changing a global option every single time I open a file isn't really very helpful. Isn't there a way to choose whether I want the designer when I open the file?

You can't change the profile on a per-page basis.  Instead it might just make sense to leave the HTML designer enabled and only click the design tab if you want/need it.

Hope this helps,

Scott

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Thursday, September 3, 2009 3:32 AM by ScottGu

@Harshil,

>>>>>>>I only use the designer for one purpose, generating the events for the server side control because i dont remember all the event signatures. Some times the events are shown in the property pane when i am in the code view mode, but it happens only rarely (think its a VS bug) so i have to go to the designer, which takes about months to load ( i can switch multiple jobs between that time).

You do need to go to the designer once in order to enable the events tab within the property window.  Once that is loaded, though, you should be able to work in source view and use the property window to add events.

Hope this helps,

Scott

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Thursday, September 3, 2009 3:33 AM by ScottGu

@Mike,

>>>>>>>> How about a post about how (if) C# 4.0 can be used in web apps?

C# 4.0 can definitely be used for web apps with ASP.NET 4.0.  I'll do several posts in the future that cover this.

Hope this helps,

Scott

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Thursday, September 3, 2009 3:50 AM by Nadeer Ravichandra

Visual Studio VS2010 is looking really good.

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Thursday, September 3, 2009 7:25 AM by michalzygula

Is anyone still using design view? I've totally forgotten there is such an option in VS :)

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Thursday, September 3, 2009 8:45 AM by Frederic Hallot

Why making this option at the VS option level.

I can perfectly imagine some project (mvc for example) where code optimized mode is better and other project where WYSIWYG Html editor is still wanted. I can even imagine that both type of project live together in a single solution. It would be better to allow this option at the project (or even page) level.

Frederic

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Thursday, September 3, 2009 11:39 AM by viscious

If you disable the Designer, do you have access to the Control Designers when it comes to WebForms?  That is the only reason I ever open design view, but for certain controls it sure is nice to be able to access their designers, think about the set validation expression on RegularExpressionValidator as one example, or "Convert to template column" in many of the 2.0 Databound controls.

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Thursday, September 3, 2009 4:52 PM by Abel Braaksma

My post #7190649 didn't get the changed title, don't know why, but otherwise the story doesn't make sense. Here it is again:

"When do we see and IDE View or Perspective Manager, in VS2012 or before?"

-- Abel --

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Friday, September 4, 2009 3:44 PM by Mathias F.

>>>>We now have an even richer extensibility system in VS10, though, so there are plenty of good opportunities for Resharper and others to provide a lot of additional value.

Will this ever include an option for others to offer a replacement for the build in wysiwig-editor?

Mathias

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Sunday, September 6, 2009 8:40 PM by Tom Nuen

Designer View is for newbie! Kill it please.

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Monday, September 7, 2009 5:19 AM by davidrhodes

----

>>>>>>>I only use the designer for one purpose, generating the events for the server side control because i dont remember all the event signatures. Some times the events are shown in the property pane when i am in the code view mode, but it happens only rarely (think its a VS bug) so i have to go to the designer, which takes about months to load ( i can switch multiple jobs between that time).

You do need to go to the designer once in order to enable the events tab within the property window.  Once that is loaded, though, you should be able to work in source view and use the property window to add events.

----

Following on from Harshil's comment above, will this be fixed in VS2010 so that you can add events from the property window without going to design view?

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Wednesday, September 9, 2009 5:43 PM by Justin

Great work on the new developments.  Unfortunately, this won't be much of use to me for the same reason that Harshil mentioned.  I also forget the event method signatures, and only use design view for that purpose.  Here's to hoping those can be generated from source view, so I can finally be rid of the cumbersome design view.  Thanks for your posts Scott.

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Thursday, September 10, 2009 12:40 AM by worldspawn[]

This is awesome. Nice to not have "features" forced on you. I never use design view and accidently opening it is always a pain.

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Monday, September 14, 2009 1:48 PM by Asif Maniar

This is a helpful addition specially as many of us don't ever look at the design.

Hope its possible to create auto wired events for you right from the code view as in the case of xaml.

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Wednesday, September 16, 2009 11:13 AM by Jim Taliadoros

Very useful feature. I do a lot of my work on laptops and page real estate is very important for me.  

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Thursday, September 17, 2009 12:18 PM by san

"VS 2010 Beta2" available where can get. Thanks.

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Thursday, October 8, 2009 2:42 PM by vst

Nice feature. Wouldn't it useful to have a dropdown instead of having three buttons; Design , Split, Source. In there if there the options are

. Design

. Source

. Code Behind

. Design/ Source split

. Design/ Code behind Split

. Source/ Code behind Split

. Design/ Source/ Code behind Split (Good for very high resolution monitors, see all the code for a page at once)!

Basically if there are also options to split the screen with code behind. Having these buttons takes more real estate, a combo may be in toolbar would be better which can be shown or hidden using customize toolbox options.

Sometimes I just want to see Code Behind with Design or Source which is not available.

Thanks for the great article as always by you. Keep 'em coming..

Regards,

Ali

troublefinding.blogspot.com

# re: Code Optimized Web Development Profile (VS 2010 and .NET 4.0 Series)

Thursday, October 22, 2009 6:00 PM by RockyMoore

Would have been nice if the description would have warned it was going to disable the html designer.  I could have saved a bit of time trying to figure out why I could not get the designer to come up :)