Tuesday, September 8, 2015

Visual Studio 2015 Productivity Features

Introduction

There are many features have been introduced with new version of Visual studio 2015 Preview version. As a developer I always look for best features that save my time in doing day today activities in Visual studio. I would like to point out only Productivity features in this article.
Perf Tips
I had to spend lot of time finding the root cause for a complex application performance issues. Pert tips of VS 2015 make our life easy.
  • While debugging, processing time and CPU usage time will be shown at the end of the each line.
  • If you add two break points and debug the app, then it shows the time taken to process code between two debug points.

  • We can able switch on/off just by clicking on any of these messages or from Tools/Options
Quick Action Light Bulb Icon:
Visual studio has new feature called Quick Action (most of them called as light bulb actions), there are sevaral uses.
  • Syntax Error assistance: This light bulb will be shown when pointer or cursor is at the error line. Upon click of this icon, VS shows the possible fixes for compilation errors, we can preview all possible fixes.
  • Code refactoring suggestions: To refactor a code line like removing unnecessary local variable or removing unused using statements .We can press Ctrl+ period (Right click + Quick Action) to see all possible way of fixing it with nice color differences.

Some situation it will be good to split the logic into more than one like to debug and readability, and then we can just click Quick action to split to multiple lines using temp variables.
Also to implement interface
There are much more uses of this Quick action light bulb like code analysis and etc.
Window Layout:
I struggle to maintain the same Windows layout in earlier Visual studio like certain height of Output window, width of Solution explorer and opening server explorer by default. VS 2015 solves this issue by introducing managing Windows Layout under Window Menu
  • Just set open the windows that you want to see all time and set the height and width as you like then click on Save Window Layout, It asks to give a name. Enter the name and save it.
  • Create multiple layout profiles as per your requirements then click on Apply Window Layout for opened instance as you wish.
  • Also we can manage all saved layouts by selecting Manage Layout Menu option.
Simplified Rename Feature:
Renaming a variable or any other c# members has improved a lot with this new version. When you click rename right click menu (F2), then it highlights all variable usages with Green color and it shows a box at the top right corner to select other features.
The changed name will reflect as you type on any highlighted instance. After typing the new name user can select other options like change same variable name in comments and strings.
Improved Break Point Settings:
Break point settings like conditions, actions are now manageable in single peek window by setting icon of break point.
Also there are other features that improves developers productivity
  • Peek windows in XAML binding expressions to view the actual definition of banded ViewModel property and static resources.
  • We can able to debug lambda expressions.
  • Creating shared projects.
  • In Built Diagnostic tools in VS 2015 to diagnose memory, performance and CPU usage while debugging application itself.
  • Sending feedback on Visual studio features has simplified by clicking smile icon on right edge.
Please refer the below links to familiar with all new features.

Monday, September 7, 2015

$(document).ready vs $(window).load vs window.onload

Many time we use $(document).ready when we work with jQuery.This code is written when we execute our code when DOM is ready except images.like If our web page has  images then  it will not wait for loading of images  and call and in one page we can apply many document.ready and it call one by one as coming sequence.we call document.ready in many ways like below and they have same functionality and it is jQuery specific event.
And if we talk about $(window).load then it is work when all DOM is ready including images so it is useful when on document load we want to work with images (calculation of image dimensions) and it is also jQuery specific event.If our web page has  images then  it will wait for loading of images  and then it  call. 
$(window).load(function() {
/** this is come when complete page is fully loaded, including all frames, objects and images **/
});
and one more thing don’t confuse with window load event with jQuery ajax load method
The onload event is a standard event in the DOM, while above two are specific to jQuery . this is also same functionality like $(window).load but  window.onload is the built-in JavaScript event.The onload event occurs when an object has been loaded.like if we take a example of image and call onload event in image tag then it will call when image will load .generally we use it in body tag.
it is call in HTML and JavaScript like
In HTML
<element onload="myFunction"></element>
In JS
object.onload=function(){/**your desire code**/};// here object can be window,body and etc
1)  Here  alert “call on body load” call  immediately after body has been loaded
In HTML
<!-- on body onload call myFunction -->
<body onload="myFunction()">
In JavaScript
// myFunction() which will call on body load
function myFunction(){
   alert("call on body load");
}
if we take a example related to image onload then it will look like below
2)  Here  alert “call on image load” call  immediately after image has been loaded
In HTML
<!-- on image onload call myImageFunction() -->
<img src="image path src" onload="myImageFunction()">
In JavaScript

// myFunction() which will call on image load
function myImageFunction(){
   alert("call on image load");

}