JanaDotNet: Top 10 Features In ASP.NET 4.5

1 - Enable Trace feature
Answer

Trace is an ASP. NET feature that displays some useful information that you can't get by using Debugger. The ASP. NET Trace feature traces the execution of a page and displays trace information. In addition to this, it also displays other information at the bottom of that page.

To use the Trace feature, you must first enable tracing. To active the Trace feature for a page, you should add a Trace attribute to the page directive at the top of the aspx file for the page and set its value to true to this attribute as shown below.

When you run the page, trace information will be displayed at the end of the page as an output. When you enable the Trace feature, it is enabled only for the current page, which is usually what you require. To enable tracing for another page, you must modify the page directive. Once this feature has been enabled for a page, ASP.NET adds trace output to the page whenever the page is requested.

For more details, click on the link:

Enable Trace Feature in ASP.NET

2 - Strongly Typed Data Controls

Answer
The benefit of the Strongly Typed Data Controls feature is that we can bind the data to the display controls with strong types and we can avoid the exceptions caused by the function Eval(expression), if the expression is not evaluated to a proper value.

This article discusses with the help of the sample code about how the data binding was programmed before ASP.NET 4.5 and in ASP.NET 4.5. This example uses Visual Studio 2012 and the project type created is a simple web site project (empty web site project). Add a default.aspx webform with code at the back end, if you do not see it in the project.

Before ASP.NET 4.5

ASPX page:
We used Eval(expression) to bind the data to the individual controls in the List view control, which is shown below:

<p><u>Normal ASP.NET Binding</u></p>
<asp:ListView ID="displayData" runat="server">
<LayoutTemplate>
<table id="Table1" runat="server">
<tr id="Tr1" runat="server">
<td id="Td1" runat="server">
Item ID
</td>
<td id="Td2" runat="server">
Item Name
</td>
</tr>
<tr id="ItemPlaceholder" runat="server">
</tr>
</table>
</LayoutTemplate>
<ItemTemplate>
<tr>
<td>
<asp:Label ID="Label1" runat="server" Text='<%# Eval("ID")%>'>
</asp:Label>
</td>
<td>
<asp:Label ID="Label2" runat="server" Text='<%# Eval("ItemName")%>'>
</asp:Label>
</td>
</tr>
</ItemTemplate>
</asp:ListView>

Code behind populating the data:
Create a class file called "Product" in a separate file and it will be added in "App_code" folder in the project. This type will be used in the code running at the back end for populating the data of the type "Product".

/// <summary>
/// Summary description for Product
/// </summary>
public class Product
{
public int ID
{
get;
set;
}
public string ItemName
{
get;
set;
}
}
/// <summary>
/// Page Load Method
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void Page_Load(object sender, EventArgs e)
{
//bind the data to the list view by calling the method PopulateProducts.
displayData.DataSource = PopulateProducts();
displayData.DataBind();
}
/// <summary>
/// Method to create new product
/// </summary>
/// <returns></returns>
public IList < Product > PopulateProducts()
{
return new List < Product >
{
new Product
{
ID = 1, ItemName = "Item1"
},
new Product
{
ID = 2, ItemName = "Item2"
},
new Product
{
ID = 3, ItemName = "Item3"
},
new Product
{
ID = 4, ItemName = "Item4"
}
};
}

Code Execution:
Your output will look as follows:

For more details, click on the link:

Strongly Typed Data Controls in ASP.Net

3 –Performance Tuning in ASP.Net

Answer
The following are the points which one needs to check before collecting data as a .NET developer.

Set debug=false in web.config

When you create the ASP.Net Web Application, by default this attribute is set to "true" in the web.config file that is very useful when developing. However, when you are deploying your Application, always set it to "false". Setting it to "true" requires the pdb information to be inserted into the file and that results in a comparatively larger file and hence processing will be slow. Hence, always setdebug="false" before deployment.

Turn off Tracing unless until required

Tracing enables us to track the Application's trace and the sequences that the developer needs to monitor the trace. When Trace is enabled, it tries to add extra information to the page. Always set this to "false", unless you require monitoring the trace logging in the production web.config.

<trace enabled="false" requestLimit=”10” pageoutput=”false” traceMode=”SortByTime” localOnly=”true”>

Choose Session State management carefully
One extremely powerful feature of ASP.NET is its ability to store session state for the users for any Web Applications. Since ASP.NET manages session state by default, we pay the cost in memory, even if you don't use it. In other words, whether you store your data in process or on a state Server or in a SQL Database, session state requires memory and it's also time consuming when you store or retrieve data from it. You may not require session state, when your pages are static or when you do not need to store information captured in the page. In such cases, where there is no need to use session state, disable it on your Web form using the directive:

<@%Page EnableSessionState="false"%>

For more details, click on the link:

Performance Tuning in ASP.Net Web Applications

4 - ASP.NET Web API
Answer
The ASP.NET Web API is one of the Microsoft open source technologies to build the powerful REST Services which will communicate across all the platforms and devices over HTTP.

Step 1: Create ASP.NET Web API Service.

After adding the MVC project, the Solution Explorer will look as shown below:

After creating the ASP.NET Web API project, the preceding folder structure and files are added into the project by default, which are the same as MVC project, so let us learn about them in brief as depicted below:

App_Start folder

This folder contains the Application configuration details such as routing, authentication, filtering of URL and so on.
Controller
This folder contains the Controller and their methods. The Controller is responsible for processing the user request and returns output as a view.
Models
This folder contains the entities or properties used to store the input values.

Step 2: Create Model Class.

EmpModel.cs

public class EmpModel
{
public string Name { get; set; }
public string City { get; set; }
}

Step 3: Add Web API Controller.

HomeController.cs

using System;
using System.Web.Http;
namespace CreatingWebAPIService.Controllers
{
public class HomeController: ApiController
{
[HttpPost]
public bool AddEmpDetails()
{
return true;
//write insert logic
}
[HttpGet]
public string GetEmpDetails()
{
return "Vithal Wadje";
}
[HttpDelete]
public string DeleteEmpDetails(string id)
{
return "Employee details deleted having Id " + id;
}
[HttpPut]
public string UpdateEmpDetails(string Name, String Id)
{
return "Employee details Updated with Name " + Name + " and Id " + Id;
}
}
}

The following is the default URL structure of ASP.NET Web API defined into the WebApiConfig.cs file.

Step 5: Testing Web API REST service using REST client.

Now let us test the application using REST client as:

POST:

In the image shown above Web API REST Service-HTTP POST method returns the 200 Status code which means REST service is successfully executed.

GET Method

In the image depicted above, Web API REST Service- HTTP GET method returns the 200 Status code which means REST service is successfully executed and returns the XML format output.

Note

The Web API REST service by default returns the output as per the browser default message header such as XML or JSON.

For more details, click on the link:

Creating ASP.NET Web API REST Service

5- Support for WebSockets protocol

Answer

Web Sockets

Create a single bi-directional connection between a Client & Server. It means that the client can send a request to the Server and forget, when the data is ready at the Server; where the Server will send it to the Client.
Native to the Browser, which makes them light weight and easy to implement.
Uses its own protocol and can tunnel thru Firewalls and Proxy with no extra effort. i.e Client does not use HTTP request but when a new WebSocket connection establishes, then the Browser establishes the HTTP connection with the Server and subsequently upgrades that connection to a dedicated WebSocket connection by setting a tunnel passing thru Firewall and Proxies.
Once the connection is established (as depicted above), it is a two way channel on which the Client and Server can communicate.

Creating a WebSocket is as easy as the code shown below:

var ws = new WebSocket("ws:<URL>");

Once the connection is established, there are the methods to control i terms off sending the data and monitoring the connection.

ws.onopen = function(){ } // Connection Open
ws.onmessage = function(){ } // received update
ws.onopen = function(){ } // Connection Close
//Funtions of WebSocket Object
ws.send(<text>);
ws.close();

Advantages:

Since the Firewall is bypassed, the streaming is very easy and can be done through any connection.
Does not need a separate connection for up-stream and down-stream.
Can be used with any client like AIR & Flex which comes with JavaScript support.

Limitations:

All Browsers do not support WebSockets as of now.

To see which Browser supports which feature of HTML5, you may refer to this link in wikipedia. It, however talks about the support in terms of a layout engine, which is an engine used to render the UI in the Browser. Though you can easily determine which Browser it uses; and which layout engine. Let me also provide it here for quick reference.

Browser	Layout Engine	Comments
Internet Explorer	Trident / MSHTML(DLL)	IE 8.0 = Trident4.0 = MSHTML DLL (8.0
Firefox	Gecko	http://en.wikipedia.org/wiki/Gecko_(layout_engine)
Chrome	Webkit	http://en.wikipedia.org/wiki/WebKit
Safari	webkit

For more details, click on link:

Websocket API in HTML 5

6 - Support for improved paging in ASP.NET 4.5 GridView control
Answer
When there are bulk records to show in the GridView, the developers often use paging to distribute the complete records with multiple pages to show the records in the GridView. This means that, when you change the page index, the GridView is bound everytime from the database to show the next records.

There are mainly two ways to implement paging in the GridView.

The first is, we can use Gridview's default paging by setting its property AllowPaging="true". The GridView will show the pager itself which depends on the PageSize and total records. This way is very tedious and degrades the performance of the Application because every time the PageIndex changes and the GridView will be bound with the complete data source that is not required at all, as we need to show only the data to the corresponding PageIndex.

To improve the performance of the web application, we usually create a custom paging control using many buttons or in any other way, since it binds the GridView with only relevant rows when the PageIndex changes. It was also very tedious to handle all the combinations of the clicks on the page links and write a lot of code-behind code in the .cs file.

Code of ASPX page.
The following mark to set GridView control.

For more details, click on the link:

Custom Paging With GridView in ASP.NET 4.5

7 - Enhanced support for asynchronous programming

Answer
In the current .NET Framework (4.5.1) and Windows Runtime, asynchronous programming has the power of the asynchronous support. The compiler performs the difficult work that the developer used to do and your Application retains a logical structure that resembles synchronous code. By using all of this, you can get the advantage of asynchronous programming.

What is Synchronous?

Synchronous represents a set of activities that starts happening together at the same time.
A synchronous call waits for the method to complete before continuing with the program flow.

In general, asynchronous programming makes sense in two cases as:

If you are creating a UI intensive application in which the user experience is the prime concern. In this case, an asynchronous call allows the user interface to remain responsive. Unlike as shown in Figure 1-1.
If you have other complex or expensive computational work to do, you can continue; interact with the application UI while waiting for the response back from the long-running task.

Asynchronous Programming Model Pattern

Relies on two corresponding methods to represent an asynchronous operation: BeginMethodName and EndMethodName.
Most often you must have seen this; while using delegates or method invocation from a Web Service.

For more details, click on the link:

Asynchronous Programming With C# 5.0

8 - Garbage Collector Improvements
Answer
A look through what MSDN has to say,

"The .NET Framework's garbage collector manages the allocation and release of memory for your application. The garbage collector's optimizing engine determines the best time to perform a collection, based upon the allocations being made. When the garbage collector performs a collection, it checks for objects in the managed heap that are no longer being used by the application and performs the necessary operations to reclaim their memory."

Each of us has heard about managed and unmanaged code. What is a managed code? OOPS basics, this is related to automatic memory management by Garbage Collection, so called GC.

GC in .NET is a very heavy process; this is improved in .NET 4.5. These improvements are intended to provide value for the developers who build large-scale Client and Server apps and many smaller apps, as well.

Garbage Collection till .NET 4.0

GC had many challenges in the older versions of .NET. The larger the application is, the more resources it will consume. ASP.NET applications run on the Server and a lot of Clients send requests to the Server which creates loads of objects, making the GC really work hard for cleaning up unwanted objects. This caused larger pause for the Application as it lowers the efficiency and the large object heap takes up more space.

To be clear, till the earlier version of .NET, i.e. .NET 4.0, when there are different threads doing their work and have managed code as well, at some point of time the GC runs creating a pause in the Application suspending all the application threads, making the Server less responsive.

What’s new in .NET 4.5 GC?
.NET 4.5 has overcome this problem, by introducing Server GC. This creates one more thread in the background, which cleans the objects. This handles only Gen 2 objects, reduces the load on main GC thread. The two threads running simultaneously reduces the suspension time and improves the Application throughput.

Enabling GC server

The GC server can be enabled by using GCServer XML tag in the web.config and enable it to true.

<configuration>
<runtime>
<gcServer enabled="true"/>
</runtime>
</configuration>

For more details, click on the link:

Garbage Collection In .NET 4.5

9 - Support for HTML5 form types
Answer
ASP.NET 4.5 provides excellent support for HTML5 form types. In HTML5, several new input types have been added and these new input types are: Sliders, Number Spinners, Popup Calendars, Color Choosers, Autocompleting suggestion boxes and more.

This article covers the new input types:

Color
Date
Datetime
Email
Month
Number
Range
Search
Tel
Time
URL
Week

In order to define, all these new input types the "<input>" Tag is used.

Input type Color

Description
This input type allows the collection of a color of the form. If a Browser supports this input type then the
intention is that clicking in the textfield will result in a Color Chooser that pops up.

The input element with a type attribute, whose value is "color" represents a color-well control to set the element's value to a string representing a simple color.

Note: Color keywords (for example, strings such as "red" or "green") are not allowed.

Syntax
<input type="color" name="some-name"/>

Example of color input type
1. <!DOCTYPE html>
3. <html lang="en" xmlns="http://www.w3.org/1999/xhtml">
5. <head>
6. <meta charset="utf-8" />
7. <title>Color</title>
8. </head>
10. <body>
11. <h2>Implementation Of color as New Input Type</h2>
12. <form action="form.asp">
13. Choose your favorite color:
14. <input type="color" name="favcolor"><br>
15. <br>
16. <input type="submit">
17. </form>
18. </body>
20. </html>
Input type Date

Description
The date type allows the user to select a date. The input element with a type attribute whose value is "date" represents a control for setting the element's value to a string, representing a date. In simple words, we can say that this input type allows collection of a date.

Syntax
<input type="date" name="some-name"/>
Input type DateTime

Description
The datetime type allows the user to choose a date and time (with time zone).The input element with a type attribute, whose value is "datetime" represents a control to set the element's value to a string representing a global date and time (with timezone information).

Syntax
<input type="datetime" name="some-name"/>
Input type Email

Description

The Email type is used for input fields that should contain an e-mail address. This gives liberty to have a field to fill E-mail address(es). This input type allows collection of an Email address. If the "list" attribute is not specified, then the intention is that the Browser supplies some help in entering a legal email address (e.g., the iPhone Browser uses an Email-optimized keyboard) and/or validation on submission.

Syntax
<input type="email" name="some-name"/>
<input type="email" list="email-choices" name="some-name"/>
<datalist id="email-choices">
<option label="First Person" value="abc@example.com">
<option label="Second Person" value="xyz@example.com">
<option label="Third Person" value="pqr@example.com">
...
</datalist>
Input type number

Description
The number type is for the input fields that should contain a numeric value. This input type allows a collection of a number (either integer or floating point). In other words, input type number means picking a number.
The input element with a type attribute, whose value is "number" represents a precise control for setting the element's value to a string representing a number.

Syntax
<input type="number" min="0" max="20" step="2" value="10" name="some-name"/>
Input type month
Description
The month type allows the user to choose a full month and an year.

The input element with a type attribute, whose value is "month" represents a control to set the element's value to a string representing a month.

Syntax
<input type="month" name="some-name"/>
Input type range
Description
This input type allows a collection of a number (either integer or floating point). All known Browsers that support this use a Slider. The exact value is not displayed to the user unless you use JavaScript.

Hence, use the number (Spinner) input type if you want to let the user choose an exact value. Browsers are supposed to use a Horizontal Slider unless you attach CSS, that specifies a smaller width than height, in which case, they are supposed to use a Vertical Slider that sets to a certain value/position.

Syntax
<input type="range" name="some-name"/>
Input type tel
Description

It is used to enter a telephone number.

This input type is intended to help you collect a telephone number. Since the format of telephone numbers is not specified, it is not clear how a normal Browser would help you with this. However, a cell phone might use an on-screen keyboard that is optimized for phone number input.

Syntax
<input type="tel" name="some-name"/>
Input type time
Description
It allows the user to select a time. The input element with a type attribute, whose value is "time" represents a control to set the element's value to a string representing a time (with no timezone information).

Syntax

<input type="time" name="some-name"/>
Input type week
Description

The week type allows the user to select a week and an year. In other words, it means picking up a specific week.

Syntax
<input type="week" name="some-name"/>
Input type Search

Description

This input type is intended to help you collect a string for a search. Since search queries are free-form text, there is never any help in inputting characters and you never have any validation on submission. However, on some platforms, search fields should look slightly different than regular textfields (e.g., with rounded corners instead of with square corners).

Define a search field (like a site search, or Google search).

Syntax

<input type="search" name="some-name"/>
Input type URL
Description

This input type allows a collection of an absolute URL. If the "list" attribute is not specified, then the intention is that the Browser supplies some help in entering a legal URL (e.g., the iPhone browser uses a URL-optimized keyboard) and/or validation on the submission.

If the "list" attribute is specified, then the intention is that the Browser allows the user to choose among a set of URLs defined separately with the "datalist" element.

Syntax
<input type="url" name="some-name"/>
<input type="url" list="url-choices" name="some-name"/>
<datalist id="url-choices">
<option label="HTML5 Spec" value="http://dev.w3.org/html5/spec/">
<option label="Some other URL" value="http://example.com/blah.html">
<option label="Yet Another URL" value="http://foo.bar.com/baz.html">
...
</datalist>

For more details, click on the link:

HTML5 New Input Types

10 - Bundling and Minification in ASP.NET

Answer

Bundling: In ASP.NET, bundling is a process of wrapping up all included files as a single downloadable resource so that the Browser's call for resources is minimized. Instead of making a one-for-one call for each file, the Browser gets all bundled files in a single call.

Minification: Minification is the process of the removal of all unnecessary characters like extra spaces, comments, new lines and so on, that has been added for readability, from the files to reduce the size of the files so that the data transfer can be minimized.

Let us understand it by an example. Suppose, we have a function for sum:

function sum(a,b)
{
return (a + b); //will return the sum of numbers
}

Generally, when we write this function in a file, the entire JavaScript file is downloaded as it is. With a minified JavaScript file, the code shown above will look like:

function sum(a,b){return (a+b);}

Clearly, it reduces the size of the file.

When to apply bundling

Having many common JavaScript/CSS files used throughout the Application
Too many JavaScript/CSS files in use in a page

For more details, click on the link:

JanaDotNet

Wednesday, 1 June 2016

Top 10 Features In ASP.NET 4.5

No comments:

Post a Comment