Performance using css sprites

What is the advantage of using css sprites?

• It reduces the round trip required to the server
• Increases performance
• On resource several uses

What is the disadvantage of using css sprites?

• Maintenance : If you change one image we have to change other image's css properties 

Sample sprite Images 

The Image on the right has width of 50 pixels and height of 100 pixels. 

First-Image : Top 50 pixels
Second-Image: Bottom 50 pixels


Css would be
.First-Image {width:50px; height:50px; background:url(images/sprite.png) 0 0px;}

.Second-Image {width:50px; height:50px; background:url(images/sprite.png) 0 -50px;}




Note:
We cannot have sprite images for all website images. Best use case would be for icon , footer menu images.

Mapping using automapper

Need  for using Automapper 

Eventually, in any application, a developer will need to translate data from one object type to another.

Common examples include DTOs (Data Transfer Objects), View Models, or even just some request or response object from a service or Web API call.

Usually we end up doing manual mapping.

How to Create simple SSIS package?

We need Sql server Business intelligence development studio to create packages.

Steps involved

• Open BIDS (Business intelligence development studio)
• Select new project as Integration Services Project

Caching specific file types

            

Today I would be writing about caching specific file types in IIS. By default this option is not provided in IIS. 

Angular pass selected item

We need to pass the selected list from the table. This can be achieved by passing the selected item list as shown below

• On ng-click  we need to pass the selected item list as parameter

• We can fetch the selected list in java script function as shown below

EDIT IN PLUNKER

Web site performance caching

                  

A web cache (or HTTP cache) is for the temporary storage (caching) of web documents, such as HTML pages and images, to reduce bandwidth usage, server load, and perceived lag.

The ability to cache and reuse previously fetched resources is a critical aspect of optimizing for performance.

There are 2 types of cache scenario

Empty cache scenario and Primed cache scenario

Web Site Performance Compression

                  

When we talk about web site compression. we are actually referring to HTTP compression.

HTTP Compression : Is a capability that can be built into web servers and web clients to improve transfer speed and bandwidth utilization.

• Http data is compressed before it is actually sent from the server
• Compliant browsers will announce what method are supported before downloading the correct format

• Browsers that do not support compliant compression method would actually download uncompressed data
• Additional CPU is used on both server and browser to compress and uncompress the content. Bytes saved over the network make this trade worthwhile. Usually we have CPU available on both end.

The most common compression scheme include GZIP, Deflate

Enable IIS to compress content

The server handles 2 types of compression
Static Content --> html, javascript and css
                             By default this is checked.

Note:1)  IIS has a threshold of no of times the file has to be requested in a given period of time before it would compress the file. By default it is 2 times within a 10 sec period. Reason to save CPU time.   
If the files are requested frequently then it might not compress the file

         2) IIS would only compress a file over a specific size

Dynamic Content --> Aspx, Cshtml, JSON 

•      Need to install dynamic compression module in IIS . We can use platform installer

  How to check if Dynamic Content compression is enabled?

C:\Windows\System32\inetsrv\config folder where we have IIS configuration file

Note
1):By default no compression is done for JSON and XML. We need to enable it
in the config file

2) We need to make sure that the mime type is supported by the client

Thumb rule for compression:
If it is text based content then we can compress